Web Development With Python

Code: https://github.com/aakashns/jovian-careers-website

There are several tools to deploy your web application but in this notebook, we are focussing on building and deploying a website using the tools provided by python.

alt

Objective

Create a “Jovian Careers” website listing job openings at Jovian
Use a modern HTML & CSS framework for layout and styling
Deploy the website to the cloud and attach a custom domain

Prerequisites

To make the best use of this tutorial make sure to go through the following tutorials/lessons prior to this one:

Python - https://jovian.ai/aakashns/first-steps-with-python
Git - https://jovian.ai/aakashns/python-local-development-git
HTML tutorial: https://htmldog.com/guides/ , https://www.w3schools.com/html/
CSS tutorial: https://htmldog.com/guides/css/ , https://www.w3schools.com/css/
Basic HTML, CSS templates : https://www.squarespace.com/blog/what-is-a-website-template

Let's get started,

Step 1 - Project Setup & Flask Basics

Create a project on GitHub
Open up the project on Replit
Create and run a Flask web server
Push changes back to GitHub

Create a Project on Github

GitHub is a platform for sharing and collaborating on software development projects which is powered by a version control system git.
We can begin by heading to GitHub and creating a new repository.

alt alt

GitHub can be used to store projects but not to develop projects. So now that we have created a github repository, we will shift to a free resource for developing i.e replit.

Open up the Project on Replit:

Replit is a free online collaborative in browser IDE that allows us to create projects and write code in many supported languages.
Replit allows us to integrate our code on GitHub i.e we can make edits on the cloud and the code will directly be synced on the cloud.

To get started, you will first need to head at https://replit.com/ and SIGN UP to create your replit account if you haven't done that already.
Once you've created your account, you will be able to view your replit dashboard. You can directly create new projects from here but ideally you should you github to keep a track of your prpjects. You can do this by connecting to GitHub:

alt

After this step, you will be able to see a GithubRepos section on your dashboard. You can always disable this integration incase it doesn't work and then re-enable it to start from scratch.
You can select your repo and import it:

alt

Which is now going to show all the repo files on replit.

Now that you have your project open, you will be asked to configure a run command which will be executed everytime we click on the run button.

alt

Head to the files tab and add a new file called app.py.