In this first part, you'll learn how to quickly spin up a reproducible development environment with Docker to manage a RESTful API powered by Python, the Flask web framework, Flask-RESTX, and Postgres. We'll then add React along with Vitest (a JavaScript test runner) and React Testing Library (a testing library designed specifically for React) to the client-side. We'll also add styling with Chakra UI and continuous integration (CI).
Learning Objectives
- Use Test-Driven Development to develop a React application
- Work with React running inside a Docker Container
- Test a React application with Vitest and React Testing Library
In part 2, we'll add password hashing in order to implement token-based authentication to the Flask app with JSON Web Tokens (JWTs). We'll then turn our attention to the client-side and add React Router to the React app to enable client-side routing along with Formik and Zod for managing and validating forms.
Learning Objectives
- Manage form state with Formik and Zod
- Implement user authentication with JSON Web Tokens (JWTs)
- Configure silent login via JWT refresh tokens
- Develop RESTful auth endpoints with Python, Flask, and Flask-RESTX
- Use React Router to manage client-side routes in React
In part 3, on the client-side we'll add an authentication flow via JSON Web Tokens (JWTs) and spend time refactoring and writing tests with React Testing Library. We'll then turn our attention to ops and deploy the application to Heroku using the GitLab CI pipeline.
Learning Objectives
- Test a Flask app with pytest
- Configure Flask Bcrypt for password hashing
- Containerize Flask and React with a single Dockerfile using a multi-stage build
- Configure GitLab CI to deploy Docker images to Heroku
- Document a RESTful API with Swagger/OpenAPI