Team Dev Frontend Client Changed

This is the client repository for the frontend team development project.

This is a simulation of professional development teamwork. Here, you work on parts of an application in teams. The application already has a backend server live with ‘users’. Your job is to develop parts of the frontend.

Learning Objectives

• Understand the software development lifecycle and take a requirement through to release
  • Gather requirements
  • Model the problem domain
  • Iterative implementation
  • Verify implementation against requirements
• Use agile project management in a team to build and maintain software
  • Use ceremonies like standups, planning sessions, retrospectives and sprint reviews to get stakeholder feedback
  • Estimate and prioritise work
  • Document work
  • Pair, mob, and work individually
  • Establish contracts between teams when working on areas of the codebase that overlap
• Use a version control tool to send Pull Requests for integrating code to a codebase
• Explain and use a Continuous Integration/Continuous Delivery (CI/CD) process to integrate and deploy features
• Maintain and monitor a live application

Project Board

Below is the beginning of your Team Dev Frontend Client Project Board. It uses Kanban. Part of the issues on the backlog there were developed from the following epic:

Teachers and students can have conversations

When signed in, a student user of id 123 can navigate to /home. They will see a list of users from their same cohort in a sidebar. They will see a feed of posts from other students and teachers in the main area. Each conversation in a post can continue with users and teachers adding comments or liking posts/comments. Post messages are ordered by date, and an input field and a submit button at the bottom to create a new post. For now, other users will see these new posts when they refresh their browser page.

A user can create a new post and this should appear on the feed. Any teacher can edit or delete an existing post or comment, unless the post or comment are made by another teacher. A student may edit or delete only the posts and comments that they have made. Any user can add a comment to an existing post. Any user can like or unlike a comment or a post. Liking is only possible if the user has not already liked that post or comment. Unliking is only possible if the user has already liked or unliked that post or comment.

Team Dev Frontend Server

There is more info' about the deployed server at https://github.com/boolean-uk/team-dev-frontend-server. There, you'll find information about the database design and the API.

Setup

Clone this repository (do not fork!)

git clone git@github.com:boolean-uk/team-dev-client.git && cd team-dev-client
npm ci
npm start

By default, the project will run with the .env.development environment on your local machine.

Please ensure that REACT_APP_API_URL matches the server's url and port (when developing, you'll be running the server locally, not using the production server).

Run Tests

Cypress setup: https://docs.cypress.io/guides/getting-started/installing-cypress

npx cypress open

Test your build before PRs

Before submitting your PR, please check that your project builds correctly without any failures, since the automatic PR checks will fail your PR if your build comes back with any errors.

Run this command:

npm run build CI=true

Fix any erorrs that come out of this command before submitting a PR.

Documentation about this: When creating a build of your application with npm run build linter warnings are not checked by default. Like npm test, you can force the build to perform a linter warning check by setting the environment variable CI. If any warnings are encountered then the build fails.

https://create-react-app.dev/docs/running-tests/

Deployment

The client is automatically deployed to AWS Amplify, at https://main.d3auuogvq1hhel.amplifyapp.com/ each time we push on the main branch.