Full Stack FastAPI, React, and MongoDB

Book description

Wield the power of Python, React, and MongoDB to build web and data applications quickly and broaden your web development horizons

Key Features

  • Learn how to build web applications without having to know the intricacies of the components
  • Build full stack projects without compromising on development speed and app performance
  • Prepare yourself for the diverse world of web development, analytics, and data visualization

Book Description

If you need to develop web applications quickly, where do you turn? Enter the FARM stack. The FARM stack combines the power of the Python ecosystem with REST and MongoDB and makes building web applications easy and fast.

This book is a fast-paced, concise, and hands-on beginner's guide that will equip you with the skills you need to quickly build web applications by diving just deep enough into the intricacies of the stack's components.

The book quickly introduces each element of the stack and then helps you merge them to build a medium-sized web application. You'll set up a document store with MongoDB, build a simple API with FastAPI, and create an application with React. Security is crucial on the web, so you'll learn about authentication and authorization with JSON Web Tokens. You'll also understand how to optimize images, cache responses with Redis, and add additional features to your application as well as explore tips, tricks, and best practices to make your development experience a breeze. Before you know it, you'll be deploying the application to different platforms.

By the end of this book, you will have built a couple of functional applications efficiently and will have the springboard you need to delve into diverse and more specialized domains.

What you will learn

  • Discover the flexibility of the FARM stack
  • Implement complete JWT authentication with FastAPI
  • Explore the various Python drivers for MongoDB
  • Discover the problems that React libraries solve
  • Build simple and medium web applications with the FARM stack
  • Dive into server-side rendering with Next.js
  • Deploy your app with Heroku, Vercel, Ubuntu Server and Netlify
  • Understand how to deploy and cache a FastAPI backend

Who this book is for

This book is for web developers and analysts who want to include the power of a modern asynchronous Python framework, a flexible data store and a powerful UI library with the combination of two of the most important programming languages today in their web development toolkit. Beginners in the field of information presentation will also find this book helpful. You must have a beginner-level understanding of Python, JavaScript, and HTML and CSS to get the most out of this book.

Table of contents

  1. Full Stack FastAPI, React, and MongoDB
  2. Contributors
  3. About the author
  4. About the reviewer
  5. Preface
    1. Who this book is for
    2. What this book covers
    3. To get the most out of this book
    4. Download the example code files
    5. Download the color images
    6. Conventions used
    7. Get in touch
    8. Share Your Thoughts
  6. Part 1 – Introduction to the FARM Stack and the Components
  7. Chapter 1: Web Development and the FARM Stack
    1. What is the FARM stack and how does it fit together?
      1. Why the FARM stack?
      2. Evolution in Web Development
    2. Why use MongoDB?
    3. Introducing FastAPI
      1. REST APIs
      2. What is FastAPI?
      3. Python and REST APIs
    4. The frontend – React
      1. Why use React?
    5. Summary
  8. Chapter 2: Setting Up the Document Store with MongoDB
    1. Technical requirements
    2. The structure of a MongoDB database
      1. Documents
      2. Collections and databases
    3. Installing MongoDB and friends
      1. Installing MongoDB and Compass on Windows
      2. Installing MongoDB and Compass on Linux – Ubuntu
      3. Setting up Atlas
      4. Importing (and exporting) data with Compass
    4. MongoDB querying and CRUD operations
      1. Querying MongoDB
      2. Creating new documents
      3. Updating documents
      4. Deleting documents
      5. Cursors
    5. Aggregation framework
    6. Summary
  9. Chapter 3: Getting Started with FastAPI
    1. Technical requirements
      1. Python setup
      2. Virtual environments
      3. Code Editors
      4. REST Clients
      5. Installing the necessary packages
    2. FastAPI in a nutshell
      1. Starlette
      2. Python type hinting
      3. Pydantic
      4. Asynchronous I/O
      5. Standard REST API stuff
    3. How does FastAPI speak REST?
      1. Automatic documentation
    4. Let’s build a showcase API!
      1. Retrieving path and query parameters
      2. The request body – the bulk of the data
      3. The request object
      4. Cookies and headers, form data, and files
      5. FastAPI response customization
    5. Summary
  10. Chapter 4: Setting Up a React Workflow
    1. Technical requirements
    2. Let’s Create (a) React App
      1. Tailwind CSS and Installation
    3. JSX and the Components – the building blocks
      1. Components
    4. React Hooks, events, and state
      1. Creating stateful variables with useState
    5. Communicate with APIs using useEffect
    6. Exploring React Router and other goodies
    7. Summary
  11. Part 2 – Parts of the Stack Working Together
  12. Chapter 5: Building the Backend for Our Application
    1. Technical requirements
    2. Introducing our app
    3. Creating a MongoDB instance for our app
    4. Creating our FastAPI backend
    5. Deployment to Heroku
    6. Summary
  13. 6
  14. Building the Frontend of the Application
    1. Technical requirements
    2. Creating our Frontend with React
      1. Setting up React and Tailwind
      2. Installing and setting up React Router 6
      3. Layout and components
      4. Creating the pages functionalities
      5. Creating the car details and the update/delete page
    3. Summary
  15. Chapter 7: Authentication and Authorization
    1. Technical requirements
    2. Understanding JSON Web Token – our key to security
    3. FastAPI backend with users and relationships
      1. Creating a User model and MongoDB relationships
    4. Authenticating the users in React
    5. Summary
  16. Part 3 – Deployment and Final Thoughts
  17. Chapter 8: Server-Side Rendering and Image Processing with FastAPI and Next.js
    1. Technical requirements
    2. Introduction to our Sample App
    3. Managing images and files in the backend
      1. Creating a Cloudinary account
      2. Creating a new MongoDB database and collections
      3. Updating the FastAPI REST API
      4. Integrating Python Pillow for image processing
    4. Introduction to Next.js and our frontend project
      1. Scaffolding the application
      2. Authentication with API routes and httpOnly cookies in Next.js
      3. Creating the page for inserting new cars
      4. Creating the car list page
      5. Creating statically generated pages for individual cars
    5. Deployment to Heroku and Vercel
    6. Summary
  18. Chapter 9: Building a Data Visualization App with the FARM Stack
    1. Technical requirements
    2. The specification
    3. Creating the backend
      1. The MongoDB Aggregation Framework
    4. Building the frontend with SWR and Charts.js
      1. React pagination and SWR
      2. Building the dashboard with Chart.js
      3. Background Tasks
    5. Summary
  19. Chapter 10: Caching with Redis and Deployment on Ubuntu (DigitalOcean) and Netlify
    1. Deploying FastAPI on DigitalOcean (or really any Linux server!)
    2. Adding caching with Redis
    3. Deploying the Frontend on Netlify
    4. Summary
  20. Chapter 11: Useful Resources and Project Ideas
    1. MongoDB considerations
    2. FastAPI and Python considerations
      1. Testing FastAPI applications
    3. React practices
    4. Other topics
      1. Authentication and authorization
      2. Data visualization and the FARM stack
      3. Relational databases
    5. Some project ideas to get started
      1. Old School Portfolio website
      2. React Admin Inventory
      3. Plotly-Dash or Streamlit – like exploratory data analysis application
      4. A document automation pipeline
    6. Summary
  21. Index
    1. Why subscribe?
  22. Other Books You May Enjoy
    1. Packt is searching for authors like you

Product information

  • Title: Full Stack FastAPI, React, and MongoDB
  • Author(s): Marko Aleksendrić
  • Release date: September 2022
  • Publisher(s): Packt Publishing
  • ISBN: 9781803231822