Zen Notes - Your Friendly Note Taking App

It doesn't get more simple than this. Save any and all thoughts, ideas, recipes in one app: Zen Notes

🔗Live Link: https://zen-note.netlify.app/

Features 💫

1. User can make a note
2. User can make some text bold / underlined
3. User can copy all text by click of a button
4. User can see the list of notes made by user
5. User can create a new note and can switch between notes

Bonus Features

1. User can clear entire note to edit note
2. User can update a note with changes in text, bold or underline
3. User can select text and copy it
4. Multiple Color Themes as per user selection using 'Paint Icon'
5. User can delete a note by clicking on 'delete' button

App Design and Flow 💫

• Click on '+' button on home page creates a pop-up for creating a note

• A pop-up window on creating a note with features as follows:

  • user can add title and description for new note
  • app handles error for blank text and description
  • user can select a text and bold, underline or copy a section of text in description using respective buttons
  • user can copy entire text in description using 'Copy All' button
  • user can clear text/description using 'Clear' button
  • add the entire note using 'Add Note' button

• Added note can be previewed as a list card on home page. User can switch between notes here.

• On click of a particular note card, pop-up window appears for updating note card

  • user can select text and use 'copy' to copy the selected text
  • user copy entire text in description using 'Copy All' button
  • user can make changes in title and description text in editable window
  • user can make changes in bold, underline after text selection and update all changes on click of 'Update Note'
  • app handles error for blank text and description if blank values are updated by user

Technologies Used 🛠️

1. Vanilla Javascript
2. HTML
3. CSS

Connect with the Makers

• Akash
• Radhika
• Prantik
• Vinit