Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/lukasvolgger/notepad

Simple notepad app imitating Google Keep for learning purposes.
https://github.com/lukasvolgger/notepad

browser css google-keep html javascript notepad notes-app

Last synced: 24 days ago
JSON representation

Simple notepad app imitating Google Keep for learning purposes.

Awesome Lists containing this project

README

        

Notepad

This is a learning project from the Frontend Web Development course of the Developer Akademie.

IMPORTANT: Please note that learning projects focus on the given tasks. It is therefore possible that some functions do not work or are not scripted.

Table of Contents

- Features
- Preview
- Installation
- License

Features


Here is an overview of the most important functions of the project. Click on the summary to expand.



Available Languages

:heavy_check_mark: German

Functionality

:heavy_check_mark: Toggle Darkmode

:heavy_check_mark: Add notes and save to local storage

:heavy_check_mark: Depending on which background color is selected for a note, the font color changes

:heavy_check_mark: Deleted notes are stored in trash

:heavy_check_mark: Restore or finally delete notes from trash

:heavy_check_mark: Responsive Webdesign

Preview

![This is an image](/img/preview/main_preview.png)

---

![This is an image](/img/preview/notes_preview_darkmode.png)

Installation


Follow these steps to install/test the project.

1. Requirements


All you need is a web browser like one of the following:



![Google Chrome](https://img.shields.io/badge/Google%20Chrome-4285F4?style=for-the-badge&logo=GoogleChrome&logoColor=white)
![Firefox](https://img.shields.io/badge/Firefox-FF7139?style=for-the-badge&logo=Firefox-Browser&logoColor=white)
![Edge](https://img.shields.io/badge/Edge-0078D7?style=for-the-badge&logo=Microsoft-edge&logoColor=white)

2. Download the Source


Download the source code or clone the repository on your local computer by clicking the Code button.



![readme_get_code](https://user-images.githubusercontent.com/55922592/198102760-e106c513-82ba-48f2-8ef1-25b0ee494fb1.png)

3. Start the Project


Navigate to the location on your computer where you downloaded/cloned the code. In the project directory, open the index.html file with a web browser.



![readme_chrome_logo_left_space](https://user-images.githubusercontent.com/55922592/198104490-f9503625-2407-465d-bf63-115405d6ade6.png)


index.html

License

![APM](https://img.shields.io/apm/l/vim-mode?label=License&style=for-the-badge)