Using NextJS and TypeScript to allow users to add, like and save pins. Implemented NextAuth.js along with Zustand for user authentication. Leveraged Firebase to manage the database and storage requirements. Built a Chrome Extension � to seamlessly add content from other websites.
?style=for-the-badge&logo=tailwindcss&logoColor=white){kind=icon}
Go to Pintastic.com or see Demo Video
- Next.js: Leveraged for its robust framework to create a highly optimized and scalable web application.
- TypeScript: Employed to enhance code quality and maintainability by providing type safety.
- NextAuth.js: Implemented for secure and efficient authentication, ensuring a seamless user login experience.
- Zustand: Utilized for state management to maintain a predictable and centralized state across the application.
- Firebase: Deployed as the backend service to handle database and storage needs, offering high reliability and scalability. Firebase’s real-time database ensures quick data synchronization, and its cloud storage provides secure and efficient file management.
- Chrome Extension:: Developed a Chrome extension to facilitate seamless pin posting from external websites. This integration boosts user engagement by 50% by allowing users to interact with the application directly from their browser, improving accessibility and user interaction.
To get a local copy up and running follow these simple example steps.
- Install NPM packages in the following directories.
npm install- Create .env files in root directory
NEXT_PUBLIC_GOOGLE_CLIENT_ID =
NEXT_PUBLIC_GOOGLE_CLIENT_SECRET =
NEXT_PUBLIC_FIREBASE_KEY =- Run Commands
npm run dev- Install NPM packages in the following directories.
cd ChromeExtension
npm install- Create .env files in root directory
PRIVATE_KEY_ID =
PRIVATE_KEY =- Run Commands
nodemon server.js- Setup Extension
cd/ ChromeExtension/ client- Go to Google Chrome
chrome://extensions
toggle developer mode ON
load client folder