Code Challenger is a website that designers can submit their designs and all designs will be available as challenges for front-end developers. Front-end developers can use these designs as challenges to further improve their talent and practice.
Credit to FrontEndMentor for being a good example.
Users should be able to:
- View the optimal layout for the site depending on their device's screen size
- Authenticate with Google or Github
- View Challenges, filter & sort them, download assets
- Submit their solution & publish it to other users, application will generate a screenshot of the solution as well.
- Submit Designs for other users to complete as challenges
- Change theme (dark / light)
- Review solutions from other users & filter & sort
- Next.js 13 & React.js
- tailwindcss - CSS Framework
- Mobile-first workflow
- Server side rendering
- Sanity.io
- Firebase Realtime Database
- Firebase Authentication
- Quill
- puppeteer
- Sanity.io data fetching & posting
- Rich text with quill
- Post processing HTML to sanity block
- Firebase Realtime Database
- Firebase Authentication
- Server-side rendering with additional functionalities (revalidate & static server pages)
- puppeteer
- Website - github