DEV Community

Cover image for Replica-of-Google-Keep
ANKIT SINGH
ANKIT SINGH

Posted on • Updated on • Originally published at github.com

Replica-of-Google-Keep

My Side project on the flask


AIM

The aim of the project was to develop a replica of google keep.

How I built it?

The major task of this project was to get to know how the control flow of google-keep work and to propose a suitable model, followed by making a good authentication so that intruders cannot affect a person's, private data like email, name, notes...

To make the data more private and not visible to others, I went on using googles OAuth authentication, wherein the hassle of login is eliminated by just using you google email ID to login and get started in this way, the user will not need to worry about extra information and get along fast.

This application allows you to make important notes, links, map locations.
All the map locations get rendered and you get to see the real-time locations of that particular place entered in the location bar.

There is a search bar to get your important notes from the bunch of todo works.

Tool used

  • HTML
  • CSS
  • JS
  • PYTHON
  • FLASK
  • SQLAlchemy
  • VS CODE
  • GOOGLE MAP API
  • OAuth API

Link to Code


Replica of Google Keep

License MIT Say thanks

screenshot

Python and Flask based application.

Instructions to follow before Running the project

sudo apt-get install python3 // If not present in your pc
sudo apt-get install python3-pip  // If not present in your pc
Run: pip install -r requirements.txt // This will install all the requirements of the project listed below:

// The (*) marks are extremely important
1. Flask==1.0.2*
2. sqlalchemy==1.2.7*
3. requests*
4. oauth2client*
5. httplib2
6. requests*
7. JSON
8. functools
9. wraps
10. mod_wsgi

Steps to execute

1. clone or download the repo into local pc.
2. Run Python app.py to start the program. //after installing all the requirements
3. open your web browser and visit http://localhost:8000/
4. Now you are ready to explore.

Note: In the map section, type the desire location and press Enter to render the location on * on-screen * map and then submit to save it in

Additional Thoughts

It was a great learning experience through this project. My learning doesn't stop here, I will be creating and contributing more in the future. Also, this web application needs more additional features such as (list notes, images notes)

Thank you octograd2020!Cheers🍻

Do follow me on twitter:

Top comments (0)