Twitter 2.0

1. Technologies Used:

   • Next.js 12
   • Tailwind CSS
   • Firebase v9
   • NextAuth
   • Recoil

2. Project Overview:

3. Project Screenshots:

   • Large/Laptop Screen View
   • Medium/Tablet Screen View
   • Mobile View

4. Imp Links:

   • https://tailwindcss.com/docs/guides/nextjs

   • https://nextjs.org/

   • adding a new project to firebase console

   • Read about dynamic "built-in" routing in next.js

   • In next.js, any file inside the pages folder is a website page.

   • In next.js any file inside the api folder is all the back-end code.

   • Read about "built-in" server in next.js

   • Breakpoints in tailwindcss for adding responsiveness:

     • https://tailwindcss.com/docs/breakpoints

     • Always remember, default styling in tailwindcss is always mobile responsive first, and then breakpoints are added to make it responsive for bigger screens. 💥💥💥💥💥

   • https://nextjs.org/docs/messages/next-image-unconfigured-host

   • postion: fixed; in css

     • https://developer.mozilla.org/en-US/docs/Web/CSS/position

   • z-index in css

     • https://developer.mozilla.org/en-US/docs/Web/CSS/z-index

   • add icons using heroicons:

     • https://heroicons.com/

     • https://github.com/tailwindlabs/heroicons

   • add icons using React Icons

     • https://react-icons.github.io/react-icons/