[WIP]: Create projects page

[AngyDev]

Summary

• Add projects page (Projects Page #16)

Changes

What kind of change does this PR introduce? (check at least one by adding an "x" between the brackets)

• Bugfix
• Feature
• Code style update
• Refactor
• Build-related changes
• Other, please describe:

Does this PR introduce a breaking change? (check one)

• Yes
• No

The PR fulfills these requirements:

• Schrödinger Hat code of conduct

[netlify]

✅ Deploy Preview for suspicious-boyd-b429fe ready!

Name	Link
🔨 Latest commit	594119f
🔍 Latest deploy log	https://app.netlify.com/sites/suspicious-boyd-b429fe/deploys/64881a7cea434e0009f30204
😎 Deploy Preview	https://deploy-preview-44--suspicious-boyd-b429fe.netlify.app/
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site settings.

[Readpato]

I was reviewing the new dependencies that have been installed for this feature and the JW Vue Pagination does not support Vue 3.
I'm afraid that when the migration from Vue2 to Vue3 is ready we won't be able to integrate it correctly causing a broken feature in the project and we would need to build it again from scratch.
Maybe we can find a library that supports either Vue2 and Vue3?

[AngyDev]

Yes @Readpato you are right, I found https://www.npmjs.com/package/v-pagination-3, it's for vue3. I hadn't thought to look for a compatible one for both versions.
I used the library compatible with vue2 to try the usage, when the migration will be ready we can change the library.

[Readpato]

Looking into that repository it seems that it needs either Bootstrap 3 or 4 as a dependency, which we currently do not use and I don't know if adding another dependency for a single feature is a good move, maybe it's up for discussion?

Doing a little bit of research I found this one here Vue awesome paginate which it seems more recently updated and it also utilizes Typescript and Vue instead of mostly vanilla JavaScript as the previous one. What do you think @AngyDev wanna give it a check?

[AngyDev]

I agree with you @Readpato, I wouldn't add new dependencies. In addition, the repository seems archived, I don't know why I didn't see it. However, I saw the Vue awesome paginated but if I remember correctly we haven't Typescript yet. I think it's possible to use it also with javascript, what do you think?

[Readpato]

Seems super good to me! I'm adding Typescript with the migration so it would be a natural step to take forward. If it doesn't work without adding Typescript as a dependency I would do it anyways and proceed with it 💪

[Readpato]

Adding the list of things that were discussed last time on the meeting that need to be updated for this PR to be merged:

• Add a short description for all the projects
• Do not implement a specific page for the project
• Create different chips for status on project:
  • Searching for contributors
  • Has good first issues
  • Etc.
• Make it easier for people find and understand the projects
• Show only SH projects (for now)
• Separate projects by:
  • Topic (Language, Backend, Frontend)
  • Difficulty (has issues that can be solved easily)
• Make it clear who is the referent of the project so it can be contacted easily.
• Review card UI and responsiveness on mobile

[TheJoin95]

Could you please rebase?

[Wabri]

Maybe dark theme is broken

[TheJoin95]

Not sure, but I think we can close this