Build your SaaS
with React & Django

Technology stack

The tech stack that we are using consists of Typescript + React + Redux in the frontend. For backend we are using Python + Django + Django REST Framework + PostgreSQL + Celery.

We deploy with docker-compose on AWS with an Nginx server and certificate from Let's Encrypt.

The source code created during the course might be a great starter for your new project.

Format

The course is created as text posts. Each new piece of code that is added to the project has an explanation.

You get a membership to the course's private repository on GitHub with instant access to all updates.

📒 Course outline

⚙️ means backend code 🎨 means frontend code 📅 coming soon

1. Setup Django Project ⚙️

   Starting a Django project and running it locally
2. Create Accounts app ⚙️

   Add a new Django app for controlling accounts (users) in the application
3. Register with email verification ⚙️

   Backend code and unit tests for new user registration with email verification
4. Create a user profile ⚙️

   Backend code and unit tests for user profile with additional user info
5. Testing logout ⚙️

   Unit test for logout REST API
6. Initialize frontend 🎨

   Initialize React application and set the project structure (add Store, RootReducer, and Routes)
7. HomeView 🎨

   Create the main page for the application
8. Pricing and Contact Us with Outlet 🎨

   Create more pages and use react-router-dom Outlet for sharing a common layout between pages
9. Register form 🎨

   Create a registration form for new users and send requests to the server
10. Verify email 🎨

    Verify email views with a POST request to the server
11. Toasts and BlockUI 🎨

    Improve usability with React-toastify and BlockUI packages
12. Login form 🎨

    Create a login form with a request to the server
13. Application pages 🎨

    Add websites available only to logged users (RequireAuth component)
14. Forgot password ⚙️ 🎨

    Add backend and frontend code for resetting passwords. Reset link is sent by email
15. Public pages🎨

    Add more public pages, like Terms of Service, Privacy Policy, and About us
16. User settings ⚙️ 🎨

    Add backend and frontend code for password changing and account removal
17. Subscription ⚙️ 🎨

    Integrate the application with the payment vendor (Paddle)
18. Deployment

    Deploy an application with docker-compose. We use Nginx, Let's Encrypt, and PostgreSQL. Deployment on AWS EC2
19. Monitor model (CRUD) ⚙️

    CRUD model for monitors in Django
20. Background tasks ⚙️

    Run Celery with background tasks for monitoring
21. UI for monitors management 🎨

    Add frontend code for monitors CRUD
22. Data visualization 🎨

    Visualize data gathered by Celery's background tasks
23. Alarms for server down ⚙️ 🎨

    Send email notifications for server-down events
24. Anomaly detection ⚙️ 🎨

    Train Machine Learning model with Isolation Forest algorithm for detecting anomaly in server time responses
25. Warn users about anomalies ⚙️

    Send an email with anomaly warnings
26. Public status pages 📅

    Add option to display public page with monitoring status
27. Login with 3rd party authentication providers 📅

    Login with 3rd party providers (GitHub, Google)
28. Teams 📅

    Create teams and invite new users. Set user permissions.
29. Multi-tenant architecture 📅

    Dynamically create subdomains for teams. Architecture with shared database and schema.
30. CI/CD 📅

    Automatically run integration tests and deployments with GitHub actions.

You build a live SaaS app

• App created during the course is live and can be used by real users (not all functions may be available yet)
• Check https://monitor-uptime.com
• The course's app boilerplate can be a great starter for your next project

You won't be alone

Don't be frustrated when you hit the blocker

• You get community and personal support with course
• Community support via GitHub issues and discussion
• Dedicated personal support via email (for help with projects that you can't share with the community)