Documentation
Tutorials
Changelog Contribution Guide Environment Setup Localization and Translation in the Open Innovation lab Technical guide for API developers CI Workflow Deployment Guide Reviewing pull requests Secret Access/Management

Tutorial

Deployment Guide

Deployment Guide for maintainers

This guide provides maintainers of the MOOCs platform project with an overview of the deployment process and the platforms used to deploy different parts of the project. It highlights the reasons for choosing these platforms and provides alternative options. Additionally, it offers insights into the build stack used in the project.

Deployment platforms

Client Application

The frontend of the MOOCs platform is hosted and deployed using Netlify, a popular platform for static site hosting and continuous deployment. Netlify offers several advantages for the project:

  • Scalability: Netlify provides a scalable infrastructure that can handle high traffic and ensure a smooth user experience even during peak loads.
  • CDN: Netlify leverages a global content delivery network (CDN) to distribute the frontend assets and deliver them to users with low latency, regardless of their location.
  • Continuous Deployment: Netlify supports continuous deployment, which automatically builds and deploys the frontend whenever changes are pushed to the project's repository. This allows for a streamlined development and deployment workflow.

The frontend is built using React, Vite, and TypeScript, which provide a modern and efficient development environment. The project also utilizes JSDoc for generating documentation, which is deployed alongside the frontend on Netlify.

Backend API

The backend of the MOOCs platform is built with Node.js and is deployed on Render, a cloud platform known for its simplicity and ease of use. Render offers the following benefits for the project:

  • Managed Infrastructure: Render provides a fully managed infrastructure for running Node.js applications, abstracting away the complexities of server management and scaling. This allows maintainers to focus on developing the backend logic without worrying about infrastructure management.
  • Ease of Deployment: Render supports simple and straightforward deployment of Node.js applications. By connecting the project's repository to Render, the backend can be automatically deployed whenever changes are pushed to the repository.
  • Scaling and High Availablity: Render ensures that the backend is automatically scaled based on demand, allowing it to handle increased traffic and provide high availability to users.

Alternative options for backend deployment include platforms such as Heroku, AWS Elastic Beanstalk, or Google Cloud Platform's App Engine. These platforms provide similar capabilities and can be considered based on the project's specific requirements and preferences.

Database

The MOOCs platform project utilizes MongoDB Atlas as the database platform. MongoDB Atlas is a fully managed cloud database service that provides a reliable and scalable solution for storing and managing data. Here are the reasons for choosing MongoDB Atlas:

  • Scalability: MongoDB Atlas allows for seamless horizontal scaling of the database, enabling the platform to handle increasing amounts of data and user traffic. It provides automated sharding and cluster management, ensuring that the database can scale to meet the project's growing needs.
  • Managed Service: MongoDB Atlas is a fully managed service, handling database administration tasks such as backups, monitoring, and maintenance. This relieves the maintainers from the burden of managing the database infrastructure, allowing them to focus on developing the platform's features and functionality.
  • High Availability: MongoDB Atlas ensures high availability through replica sets and automatic failover. It replicates data across multiple servers, enabling continuous operation even in the event of hardware or network failures. This ensures that the platform remains accessible to users and minimizes the risk of data loss.
  • Security: MongoDB Atlas offers robust security features, including encryption at rest and in transit, authentication mechanisms, and fine-grained access control. It ensures that the platform's data is protected from unauthorized access and adheres to industry-standard security practices.

MongoDB Atlas offers robust security features, including encryption at rest and in transit, authentication mechanisms, and fine-grained access control. It ensures that the platform's data is protected from unauthorized access and adheres to industry-standard security practices.

Alternative options for database deployment include platforms such as Amazon DocumentDB, Google Cloud Firestore, or Microsoft Azure Cosmos DB. These platforms provide similar capabilities and can be considered based on the project's specific requirements and preferences.

Steps for deployment

This guide provides step-by-step instructions on how to deploy the MOOCs platform to Render, a cloud platform that simplifies the deployment and management of applications. The platform consists of a frontend built with React, Vite, and TypeScript, hosted on Netlify, and a backend built with Node.js, deployed on Render. By following this guide, maintainers will be able to deploy the platform efficiently and ensure a smooth deployment process.

Prerequisites

Before proceeding with the deployment, ensure that you have the following prerequisites in place:

  1. Render Account: Create an account on Render if you don't already have one. Render offers a simple and scalable hosting platform that supports a variety of applications.

  2. Netlify Account: Sign up for a Netlify account at netlify.com if you haven't done so already. Netlify is a popular hosting platform for static websites and offers seamless integration with various frontend frameworks.

  3. Render CLI (Optional): Install the Render command-line interface (CLI) tool on your local machine. The Render CLI provides a convenient way to manage your deployments from the command line. You can find installation instructions in the Render documentation.

Frontend Deployment (Netlify)

The frontend of the MOOCs platform, built with React, Vite, and TypeScript, will be hosted on Netlify. Follow these steps to deploy the frontend:

  1. Build the Frontend: Run the build command for the frontend project to generate the production-ready assets. Depending on your project setup, the command could be npm run build or yarn build.

  2. Create a Netlify Site: Log in to your Netlify account and create a new site. Connect the site to your project's Git repository for automatic deployments.

  3. Configure Build Settings: In the Netlify site settings, configure the build settings for your frontend project. Specify the build command, build directory, and other relevant configurations based on the project's setup.

  4. Deploy to Netlify: Trigger a deployment to Netlify either manually or by pushing changes to your Git repository. Netlify will automatically build and deploy the frontend based on the specified build settings.

  5. Custom Domain (Optional): If you have a custom domain, you can configure it in the Netlify site settings to map your frontend to the desired domain.

Backend Deployment (Render)

The backend of the MOOCs platform, built with Node.js, will be deployed on Render. Follow these steps to deploy the backend:

  1. Configure Render Environment: Log in to your Render account and create a new environment for your backend deployment. Choose the appropriate options for your project, such as the desired cloud provider, region, and instance type.

  2. Create Render Service: Within the environment, create a new Render service for your backend. Specify the service name, deployment type (Docker or Static), and other relevant configurations.

  3. Configure Build Settings: If you are using a Docker deployment, provide the necessary Dockerfile and build context. If you have a static deployment, specify the build command and build directory for your backend project. The build settings will vary depending on your project's setup. For this project, refer to the Environment setup documentation for the start and build commands for the backend API.

  4. Configure Environment Variables: In the Render service settings, set up the required environment variables for your backend. This may include database connection strings, API keys, and other sensitive information.

  5. Deploy to Render: Trigger a deployment to Render either manually or by pushing changes to your backend project's Git repository. Render will build and deploy the backend based on the specified build settings and environment variables.

  6. Custom Domains and SSL (Optional): If you have a custom domain, you can configure it in the Render service settings. Render also offers built-in SSL certificate provisioning, allowing you to secure your backend with HTTPS.

  7. Monitoring and Scaling (Optional): Render provides monitoring and scaling options for your deployed backend. Explore the Render documentation to learn more about monitoring your service's performance and scaling it based on demand.

  8. Testing and Verifying: After the deployment is complete, thoroughly test and verify that the backend is functioning as expected. Use tools like cURL, Postman, or integration tests to ensure all endpoints and functionalities are working correctly.

  9. Continuous Deployment: Render supports continuous deployment, allowing you to automatically deploy your backend whenever changes are pushed to the repository. Refer to the Render documentation to learn more about setting up continuous deployment for your backend.