The clone of Apple's notes app

Related tags

React notes-app
Overview

Notes App

Exactly like Apple's notes app but web version (so windows users can write notes too).

Try it out right now (hosted on firebase)

Top features

  1. Create new note
  2. Remove note
  3. Make some text bold or italic
  4. Mobile-friendly UI
  5. Dark mode
  6. Amazing offline experience

The technical details

This project was bootstrapped with Create React App.

Libs used:

  • Redux for the state managment
  • TailwindCSS to avoid writing css
  • Dexie to store notes in the IndexedDB
  • Workbox to make web offline

Available Scripts

In the project directory, you can run:

yarn start

Runs the app in the development mode.
Open http://localhost:3000 to view it in the browser.

The page will reload if you make edits.
You will also see any lint errors in the console.

yarn start:prod

Builds the app and runs it with http-server. It's useful if you like to test Service Worker.

Server Worker doesn't work with yarn start

yarn build

Builds the app for production to the build folder.
It correctly bundles React in production mode and optimizes the build for the best performance.

The build is minified and the filenames include the hashes.
Your app is ready to be deployed!

You might also like...

Creating this clone to learn the fundamentals of Next Js and Tailwind CSS.

Next.js + Tailwind CSS Example This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind

Feb 2, 2022

Clone da GUI do Windows 11 desenvolvida utilizando ReactJS, NextJS, MaterialUI e ReactDND.

Clone da GUI do Windows 11 desenvolvida utilizando ReactJS, NextJS, MaterialUI e ReactDND.

Vídeo demonstração Iniciando a execução: npm run dev Frameworks & Bibliotecas: React.js - uma biblioteca JavaScript para a criação de interfaces de us

Dec 19, 2022

Airbnb-React - In this project, An Airbnb experience page clone is created to learn and implement React props concepts.

Airbnb-React - In this project, An Airbnb experience page clone is created to learn and implement React props concepts.

Create React Airbnb App In this project An airbnb experience page clone is created to learn and implement React props concepts. Objectives Learn about

Jun 28, 2022

React sce instagram clone

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: ya

Jan 5, 2022

NetflixClone - Netflix clone with react , styled components and firebase with user authentication.........

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Jan 3, 2022

Twitter-client - client for twitter-clone

Twitter (Client-Side Rendering) Please star this repo if you like ⭐ It's motivates me a lot! Getting Started This project was bootstrapped with Create

Jul 29, 2022

The Tesla Clone built in React Native FrameWork

The Tesla Clone built in React Native FrameWork

Tesla Clone The Tesla Clone built in React Native FrameWork Features Flat Infinite Scroll List View with animations. Design is responsive to different

Feb 10, 2022

Clone of playsnake.org using React and TypeScript

Snake Game Clone of playsnake using React and TypeScript References Keycode React TypeScript Cheatsheet .ts vs .tsx ES6 import from root What does 'de

Dec 29, 2022

A web application which is a clone of Google keep. Made it by using react framework.

A web application which is a clone of Google keep. Made it by using react framework.

Oct 30, 2022
Owner
Dmitry Kulakov
Делаю фронтенд; Питаюсь хачапури; Любимый знак препинания — тире
Dmitry Kulakov
Note Port is a frontend clone of Google Keep. It uses localstorage to save your notes!

Note Port About Note Port is a frontend clone of Google Keep. It uses localstorage to save your notes! Tech Stack React Screenshots Things I want to a

Mohit Dhatrak 3 Sep 10, 2022
Twitter-Clone-Nextjs - Twitter Clone Built With React JS, Next JS, Recoil for State Management and Firebase as Backend

Twitter Clone This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn de

Basudev 0 Feb 7, 2022
Finished code and notes from EFA bonus class on building a React project without create-react-app

React From Scratch Completed Code This is the completed code for the EFA bonus class on building a React project from scratch. Included are also markd

Conor Broaders 3 Oct 11, 2021
Netflix clone app with React.js and Redux

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Moustapha Mahmoud 5 Dec 9, 2022
A Google Clone which built with ReactJS. You can click the demo and search whatever you want!

Google Clone with ReactJS A small web app that imitate the desktop web version of google site, you can search whatever you want. Google Clone Demo Lin

Özge Coşkun Gürsucu 36 Aug 14, 2022
İnstagram Clone.You can sign in, sign up, upload image, make comment 📷 Used ReactJS, Material UI, Firebase, Firestore Database

?? instagram-clone This is a instagram clone. You can sign in, sign up, upload image, make comment ?? ⚡ LIVE To check out the live demo of this app AB

null 22 Apr 20, 2022
A Facebook Clone which built with reactJS. You can sign in with your Google Account and send realtime posts.

Facebook Clone with ReactJS A Facebook Clone application that you can sign in with your Google Account and send realtime posts. Facebook Clone Demo Li

Mert Çankaya 23 Nov 25, 2022
This is my portfolio GitHub clone website. The frontend is build using NextJS and TailwindCSS.

Github Clone Portfolio Website Tech Stack used: NextJS Tailwind CSS The contact form in this website is connected to Notion. If you want to integrate

Unnati Bamania 22 Oct 5, 2022
uber-eats-clone react native

Uber Eats Clone Uber Eats Clone React Native Tools and technology react-native Stripe payment checkout expo tailwind css yelp API Firebase (Authentica

Khalid Saifullah 18 Dec 7, 2022
trying to clone tiktok using next, typescript, tailwindcss and hasura graphql. For educational purposes only

This is a Next.js project bootstrapped with create-next-app. Getting Started First, run the development server: npm run dev # or yarn dev Open http://

null 2 Jan 4, 2022