Skip to content

TakeNotes is a note taking app, you can pen down all your notes here, besides it provides multiple functionalities to the user.

Notifications You must be signed in to change notification settings

Namrata-J/TakeNotes

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

TakeNotes

TakeNotes is a note taking app, you can pen down all your notes here, besides it provides multiple functionalities to the user.

image

Tech Stack:

  • ReactJs
  • CSS3
  • Typescript
  • Testing in Jest

Pages

  • Landing Page
  • SignUp page
  • Login Page
  • Logout Page
  • Profile
  • Archive
  • Labels
  • Home
  • Trash

Features

  • Authentication with validation using regex
  • create note, notes listing, filter & sort functionality
  • pin/unpin, archive/unarchive, delete/permanently delete/restore, edit&save note functionality
  • clean UI, crud operations

Functionalities

This app is divided into multiple components, the major components are createNote and Note component.

image

Add a note

To add a note, click on the "Add Note" button in the sidebar or focus on the "Take a note..." section. It will expand the textbox, where you can add a title and desciption to the note. Then click "☑" and it will add your note to notes list.

image

image

Edit and delete note

  • Edit Note
    • you can click on the "Edit" button which will open the same component with the textbox where you can edit a note & save it.
  • Delete Note
    • you can click on the delete icon which will delete a note.

image

image

image

image

Filters

  • Sort By Date you can sort the notes by the date added/created.
    • Newest first
    • Oldest First
  • Filter By Category
    • Labeled
    • Pinned
    • Archived
  • Filter By Labels
    • Filter By Labels that you've added

image

Change Card Color

when clicked on color palette icon, it opens color containers (div) where if you click on any one of it, it will change the background color of the note.

image

Add Labels to notes

when clicked on the labels icon, it opens a container with a input and "add label" button. Using it you can add a note to the note.

image

Trash & Archive

  • Archive Notes
    • When clicked on archive icon, it archives the note and vice-versa.
  • Delete Notes
    • When clicked on delete icon, it delete the note and adds it to the trash list.

image

image

Listing on pages

List the notes on different pages according to their category.

image

image

image

Restore note & delete permanently

You can restire the note from the trash list by clicking on the restore icon. And can delete it permanently by clicking on delete button.

image

Auth pages

SignUp Page

image SignUp using you email and password. Has also toggle hidden password functionality.

LogIn Page

image Provides guest login functionality.

LogOut Page

image

About

TakeNotes is a note taking app, you can pen down all your notes here, besides it provides multiple functionalities to the user.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published