Math Solver

Neel PatelNeel Patel
2 min read

Time duration: September 28, 2024, to October 13, 2024.

Frontend: Built with React, Hosted on Netlify

For the frontend, I used React to build the application and managed my code on GitHub. After ensuring everything was functional locally, I chose Netlify to host the frontend. Netlify makes it simple to deploy and manage frontend projects with its seamless integration with GitHub repositories.

  1. Code: Frontend Repository on GitHub

  2. Hosting: I linked my GitHub repo to Netlify, set up continuous deployment, and configured the build settings.

  3. Update: Whenever I push new updates to the GitHub repository, Netlify automatically redeploys the application, keeping the live version up-to-date.

Backend: Built with Python, Hosted on Render

The backend of my application, developed using Python with Flask, is also hosted on GitHub. I decided to use Render for hosting due to its flexibility and ease of use.

  1. Code: Backend Repository on GitHub

  2. Hosting: Render allowed me to deploy the backend quickly by linking it with my GitHub repository. I could easily set up environment variables, monitor logs, and manage services.

Synchronizing Frontend and Backend

One key step was ensuring the frontend communicated seamlessly with the backend. After deploying the backend on Render, I updated my frontend code to reference the new backend URL. This allowed the frontend to correctly interact with the backend services, providing a smooth user experience.

Deployment Process: A Visual Journey

Here are some images illustrating key steps I followed while deploying:

  1. Deploying Frontend on Netlify:

  2. Deploying Backend on Render

Conclusion

Building and deploying this full-stack application has been a rewarding journey. Throughout this process, I not only learned how to configure environments and synchronize services across different platforms but also significantly enhanced my skills in both React and Python. It’s empowering to see how a simple GitHub push can trigger updates across both the frontend and backend. I’m excited to continue building and developing more projects in the future.

0
Subscribe to my newsletter

Read articles from Neel Patel directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Neel Patel
Neel Patel