Skip to content

A React app in which the user can create, edit and delete personal annotations.

License

Notifications You must be signed in to change notification settings

GabrielMCavalcante/notes-firebase-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

App Logo

Notes

A web application for creating, editting and deleting personal notes.

home

Read this document in your language:

Notes is a web app which imitates a personal annotation manager, giving the user the ability to create, edit and delete notes. Every note is saved on a firebase firestore instance, and each user must be authenticated to use this application. Users can signup if they do not have an account yet, or login if they do so.

Technologies used

  • React
    • React Router
    • Redux
  • npm
    • iconify
    • uuid
    • moment
  • Firebase
    • Firestore
    • Hosting
    • Authentication

Index

Installation

  1. Make sure to have installed NodeJS on your computer
  2. Clone this repository using git
  3. Open terminal on cloned repository
  4. Run npm install or, for yarn users, yarn add to install all dependencies
  5. Go to src/firebase/init.ts and add your Firebase Firestore configuration (generated by Firebase)
  6. Run npm start or, for yarn users, yarn start to run the project on localhost:3000

Back to top
Back to index

How to use

First, go to this link to access the application hosted on firebase. Then, follow the steps below:

  1. Register

All users must register before using Notes. To do so, just enter with your account email and password on the login screen. If you don´t have one, click on the 'I don´t have an account' link and signup.

signup


  1. Homepage

After registered, the user will be redirected to the homepage. Here, the user can do most of the functionalities of the app, such as creating a new note by clicking on the giant 'Add note' card button or by selecting this option on the sidebar menu on the left, as well as edit an already created note by simply clicking in it.

notes-saved

creating-note


  1. Notes deleted

When a user deletes a note, it goes to the trash. There, the user can restore notes deleted or remove them permanently. There is also the possibility to read deleted notes, but not to edit them (must restore them first).

view-deleted


  1. Additional functionalities

Apart from the primary functionalities of the app, there are secondary ones which can improve the user experience. From filters to multiselection, notes management becomes easier and faster.

  • Order by

    Order all notes by title, date of creation or modification

  • Filter

    Filter notes by their color, which can be changed in edit screen

orderby-and-filter

  • Multiselection

    Multiselection enables the user to select multiple notes at once

    multiselection

Back to top
Back to index

License

MIT License

Copyright (c) 2020 GabrielMCavalcante

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Back to top
Back to index

About

Back to top
Back to index