Hello Everyone,
In this series, we are building our new project, FirstContri.
Welcome to Day 0 of the project. Today I'll explain to you the basic understanding of how we will build our project, its architecture, etc.
What does FirstContri do?
Well, FirstContri is a place where one can find good first issues, documentation, and all issues by just entering the name of the organization and repository. As a fresher, I always find it difficult to choose and find issues that I can contribute to a particular organization or project. So I built this to help me find all my issues.
What tech stacks are we using in this project?
Front-End: HTML, CSS
Back-End: Python (Flask)
Scrapper: Python
This project is very beginner friendly as it uses the easiest tech stacks available.
What will you learn from this project?
We will learn about the basics of Flasks framework, Python, Python modules like beautifulsoup4 or bs4, requests, etc. We will also learn how to Dockerize our project and push it to the Docker Hub.
The architecture of the application
Before building any application, one must know the basic architecture of the app. This helps in understanding the relationship between files, their working, routing, etc.
The architecture of our projects looks like this :
Root Folder/Repository Folder:
This is the main Directory where our source code will be stored and it is divided into two sections (note - they are sections and not directories). This architecture shows that there will be a Github repository, or the root folder, where there will be two sections:
- Front-End
- Back-End
Front-End Structure:
In the front-end section, there will be two directories named static and templates. These files are the standard front-end file structure for Flask.
In static files, all the CSS and JavaScript files are stored. This directory is not accessible by the user unless and until the exact endpoint name is called. And in the templates folder, all the HTML files are stored.
Back-End Structure:
The back-end section consists of the app.py file, which will consist of the Flask code as well as the routing code in Python.
How will we start building?
Fire up a code editor (preferably VS Code, cuz it's beginner-friendly).
Make a folder named FirstContri (this is our root directory).
Open the integrated terminal in VS Code.
Go into the FirstContri folder.
Go to the terminal and install Flask, Requests, and BeautifulSoup4.
Make two more folders named 'static' and 'templates'.
Make a file named app.py in the root directory.
Project Timeline
So our project timeline will look like this:
Creating the logic or scraper for our app
Making the Backend in Flask
Making HTML, and CSS files
Dockerizing our Project and What Next