Build a Next.js Firestore Blog Post CRUD App Using react-quill WYSIWYG Editor in Browser

  • Post author:
  • Post category:Next
  • Post comments:0 Comments

 

 

npx create-next-app blogcrud

 

 

cd blogcrud

 

 

npm i firebase

 

 

npm i sass

 

 

npm i react-quill

 

 

Now inside your index.js file of your next.js project first of all copy paste the below code

 

 

index.js

 

 

 

 

 

And now make a firebaseConfig.js file inside the root directory and copy paste the below code

 

 

firebaseConfig.js

 

 

 

 

Here you will replace the details of your own firebase project

 

 

Now you need to create the components folder inside the root directory and create two files

 

NoteDetails.js

 

 

NoteOperations.js

 

 

 

NoteDetails.js

 

 

 

 

NoteOperations.js

 

 

 

 

And lastly for styling the app you need to create a new scss file inside the styles folder called as Evernote.module.scss

 

 

Evernote.module.scss

 

 

 

 

 

Now you can start the app in command line

 

 

npm run dev

 

 

Leave a Reply