Revature Full Stack Java Project 2 Demo

Squawk

Project Repo

Table of Contents

1. Contributors
2. About The Project
   • Built With
3. Getting Started
   • Prerequisites
   • Installation
4. Module Break Down
5. Acknowledgements

Contributors

Kirill Klimov - kirill674@revature.net

Travis Morse - travis741@revature.net

Audie Ni - audie520@revature.net

Brayden Nordine - brayden018@revature.net

William Osborne - william185@revature.net

Travis Pomeroy - travis928@revature.net

Matthew Shen - matthew945@revature.net

About The Project

Squawk was a collaborative project produced by the trainees of the Revature Next Gen Java AWS Angular v3.2 training course. This project aimed to create a social media website based off of a set of provided project requirements.

Overview

Our team built out this project from an empty repo over the course of 3 weeks. We were expected to use the tools as we learned them, observe AGILE practices, and continue other training while the project was underway.

Team Member Expectations and Workflow:

• Independently developed project components while maintaining communication with other team members
• Participated in daily standups to communicate progress, plans, and blockers
• Maintained a ticketing system to track progress
• Exceed expectations by implementing stretch goals on top of the baseline expectations

Tech Stack

• Angular
• Spring
• RxJS
• PostGreSQL

Getting Started

To explore the project, follow the instructions below.

Installation

1. Clone the repo

   git clone https://github.com/221128-Java-Angular-AWS/P2.git

2. Navigate to the UI folder

   cd src/ui
   

3. Install NPM packages

   npm install

4. Navigate to src/main/java/come/revature, and run SquawkApplication.java to run the TomCat server

5. Serve the Angular application from the UI folder

    ng serve --open

6. Navigate to localhost:4200 in your browser

Page Overviews

Login/Register

Our bespoke login/register page allows for users to create an account or log into an existing account. Usernames and passwords are validated as the user fills in the inputs, and passwords are hashed before being stored in the database for increased security. A cookie is generated to maintain a seamless user session experience. Optional information is also collected during registration to populate the user profile.

Home

Our custom design divides the home page into two components: a feed of user posts, as well as a column which displays user profiles. The interactive feed allows users to like, comment, or reply to user posts, as well as to create new posts of their own. Images and embedded Youtube videos can be added to user posts.

By default, the right column displays the logged-in user's profile information. Other users' profile information can also be displayed here.

Navbar

A persistent navigation bar allows users to navigate the website, as well as to search for other users.

Acknowledgements

• npm
• Img Shields
• bcrypt
• Figma
• Special thanks to our amazing trainer, Kyle!