DEV Community

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

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

3

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:

Image of Datadog

The Essential Toolkit for Front-end Developers

Take a user-centric approach to front-end monitoring that evolves alongside increasingly complex frameworks and single-page applications.

Get The Kit

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay