Scribd
Upload
53 views4 pages

Case Study Full Stack Developer

The document outlines a case study for developing a full-stack task management application with user authentication using React.js for the frontend and Express.js with TypeScript for the backend, utilizing PostgreSQL as the database. Key deliverables include user authentication, CRUD operations for tasks, Dockerization of the application, and comprehensive documentation. Optional enhancements include unit tests and improved error handling for both frontend and backend components.

Uploaded by

Rajat Pratap Singh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
53 views4 pages

Case Study Full Stack Developer

The document outlines a case study for developing a full-stack task management application with user authentication using React.js for the frontend and Express.js with TypeScript for the backend, utilizing PostgreSQL as the database. Key deliverables include user authentication, CRUD operations for tasks, Dockerization of the application, and comprehensive documentation. Optional enhancements include unit tests and improved error handling for both frontend and backend components.

Uploaded by

Rajat Pratap Singh
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 4

Case Study: Task Management Application with User Authentication

1.​ Objective:

Develop a full-stack application where users can log in and manage tasks. The application must
support user authentication, CRUD operations on tasks, and be fully Dockerized for easy
deployment and execution. PostgreSQL should be used as the database, and the backend
should follow best practices with Express.js and TypeScript for scalability.

2.​ Deliverables:

1.​ Frontend (React.js):


a.​ A login screen for user authentication.
b.​ A screen to display and manage tasks (CRUD operations).
c.​ State management using Redux.
d.​ The ability to persist user authentication (JWT tokens).
2.​ Backend (Express.js + TypeScript):
a.​ User authentication using JWT (JSON Web Tokens).
b.​ CRUD API endpoints for managing tasks.
c.​ PostgreSQL database integration using Prisma ORM.
d.​ Swagger documentation for all API endpoints.
3.​ Dockerization:
a.​ Dockerize both the frontend and backend.
b.​ Create a docker-compose configuration to orchestrate the services, including a
PostgreSQL database container.
4.​ Documentation:
a.​ Include a detailed README.md file explaining:
i.​ How to set up and run the project locally.
ii.​ How to use Docker to run the entire application.
iii.​ Information about the available API endpoints and their usage.
5.​ Optional Enhancements (Bonus Points):
a.​ Add unit tests for the backend services.
b.​ Include error handling and validation for both frontend and backend.
c.​ Implement a refresh token mechanism for user authentication.

1
3.​ Requirements:

Frontend:

●​ Authentication Workflow:
o​ Users must log in using a valid username and password.
o​ The frontend must store the JWT token securely (e.g., localStorage).
o​ Include logout functionality.
●​ Task Management:
o​ A form to create and edit tasks (title, description, and status fields).
o​ A list view showing all tasks.
o​ Buttons for updating and deleting tasks.
●​ Technologies:
o​ React (Vite) for fast development
o​ Redux Toolkit for state management
o​ Axios for API requests

Backend:

●​ Architecture:
o​ Express.js with TypeScript for type safety and maintainability
o​ Prisma ORM for database access
o​ JWT authentication for secure login
o​ Swagger documentation for API

●​ Endpoints (Swagger Documentation Required):


o​ Authentication:
▪​ POST /api/auth/login: Authenticate the user and return a JWT token.
▪​ POST /api/auth/register: Create a new user.
o​ Tasks:
▪​ GET /api/tasks: Fetch tasks for the logged-in user.
▪​ POST /api/tasks: Create a new task.
▪​ PUT /api/tasks/{id}: Update an existing task.
▪​ DELETE /api/tasks/{id}: Delete a task.
●​ Database:
o​ Use PostgreSQL as the database.
o​ Define database tables for Users and Tasks with relationships.

2
4.​ Dockerization Instructions:

As part of this case study, the entire application (frontend, backend, and database) must be
Dockerized. The following points must be addressed.

1.​ Frontend Dockerization:


a.​ Package the React application to run in a containerized environment.
b.​ Define a Dockerfile for building the frontend image.
2.​ Backend Dockerization:
a.​ Create a Dockerfile for the Express.js backend.
b.​ Ensure dependencies are included, and the API is properly exposed.
3.​ Database Setup:
a.​ Include a PostgreSQL database as part of the Dockerized solution.
b.​ Provide environment variables for database configuration (e.g., username,
password, database name).
4.​ Service Orchestration:
a.​ Use docker-compose to orchestrate all services.
b.​ Ensure the application can be started with a single docker-compose up
command.

Dockerization Requirements:

●​ The docker-compose file must:


o​ Define services for the frontend, backend, and database.
o​ Set up necessary environment variables for the PostgreSQL database.
o​ Configure network settings so the frontend can communicate with the backend.
●​ The README.md must include:
o​ Instructions on how to build and run the application using Docker.
o​ Common troubleshooting tips for Docker-related issues.

5.​ Evaluation Criteria:

1.​ Functionality:
a.​ The application must provide user authentication and task management
features.
b.​ All CRUD operations must be functional and properly integrated with the
backend.

3
2.​ Code Quality:
a.​ Follow best practices in both frontend and backend development.
b.​ Maintain a clean and modular codebase.
3.​ Dockerization:
a.​ The application must run seamlessly using Docker.
b.​ Services must be well-defined and interconnected in the docker-compose file.
4.​ Documentation:
a.​ Provide a clear and concise README.md file with setup instructions.
b.​ Include an API reference for available endpoints.
5.​ Extra Points:
a.​ Unit tests for backend services.
b.​ Error handling and validation for both frontend and backend.
c.​ Swagger documentation for the backend API.

Good luck.

You might also like