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: 8 months ago
JSON representation

Simple notepad app imitating Google Keep for learning purposes.

• Host: GitHub
• URL: https://github.com/lukasvolgger/notepad
• Owner: LukasVolgger
• License: mit
• Created: 2022-03-16T08:55:40.000Z (almost 4 years ago)
• Default Branch: main
• Last Pushed: 2022-10-26T18:16:07.000Z (over 3 years ago)
• Last Synced: 2025-02-22T18:49:37.424Z (about 1 year ago)
• Topics: browser, css, google-keep, html, javascript, notepad, notes-app
• Language: JavaScript
• Homepage: https://github.com/LukasVolgger/notepad
• Size: 277 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

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)