Created Projects directory page

elevynto commented 1 month ago

This PR includes the creation of a Projects directory page with the below features:

Feat: http://localhost:3000/projects route
Feat: Search bar with button and press Enter submission
Feat: Dynamic filter checkbox generation based on a string[] prop
Feat: Fetch calls to the db based on a full or partial match of the query string provided
Feat: Auto fetches some verified projects on first mount
Feat: The filter tags currently don't get included in the fetch call query to the db but do get processed and console.logged for now
Feat: Created a reusable checkbox component
Fix: Added condition to set the IMAGE_BASE_URL to the devs db URL when set to development env because it couldn't access the images I had uploaded otherwise
Refactor: Created a ProjectsGrid component using jsx from ShowcaseGrid so it could be reused in the new projects directory

I have a lot of experience with React but not so much with Nextjs. I would double check whether I have implemented best practice (e.g. client/server side rendering guidelines etc.)
I left out the lazy loading aspect of this issue because I would assume the Project Lead would want to choose a library for this (see recommendation below).

For lazy loading I assume you meant the list items not loading until you scroll down to them (virtualization rendering)? If so I'd recommend looking into a library like react-virtuoso.
You might want to look into creating and adding a .prettier file to the codebase this way it will help with aligning everyone's syntax styles.

vercel[bot] commented 1 month ago

@elevynto is attempting to deploy a commit to the Elliot Team on Vercel.

A member of the Team first needs to authorize it.

elevynto commented 1 month ago

Awesome PR - approving this 💜

Clean refactors and good use of the existing APIs

Amazing, thank you! It was fun to work on! 💜

Monad-Pad / gmon.link