💡 Inspiration
Tired of stalking Github repos? Looking for some help with your next big idea? When it comes to side projects, we’re always looking for ways to celebrate and support each other. In the Fellowship, we’ve met so many skilled coders and innovative thinkers, and we wanted to create a platform to showcase what everyone has been working on. Whether it’s a passion project or a cool hackathon submission, ProjectHub provides a way for fellows to share their ideas and find the right teammates to continue growing them. Originally inspired by the “Free Agents” and “Project Pitches” thread on Github, we wanted to bring collaboration to the next level and create connections that will last far beyond the Fellowship.
💁 What it does
ProjectHub is an online platform that makes it easy to find and share projects between fellows. Our web app is designed to help fellows explore, create and collaborate.
Explore
On the ‘Explore’ page, we display a gallery of project thumbnails that have been previously saved in our database. In order to display the most relevant results, we offer the option to filter projects by tags, such as a specific programming language or category. Clicking on a thumbnail will open up further details, including a project description, uploaded images, a Github/demo link, project tags, date posted, and whether the project owner is looking for help. To save a project, there is a bookmark feature available if the user is signed in. Although users are able to access the project gallery without authentication, we highly recommend signing in with Github so that they are able to save projects and post their own!
Create
To post a project, the user has the option of starting a brand-new project or importing an existing Github repo from a URL, which we use to autofill the necessary information. Contrary to a Github repo, we focus on presenting the project details in a concise but comprehensive format, so that other fellows can quickly digest the information.
Collaborate
With these two primary features, we can create a portal for open collaboration among fellows. If a project looks interesting, we encourage fellows to reach out to each other and offer their expertise!
👨💻 How we built it
ProjectHub boasts a 3-tiered web architecture, created by following the full cycle of software development:
1. Planning:
- Brainstorming: On a Google doc, we all met up together to brainstorm all the problems that we, as fellows, are encountering throughout the program.
- Research: We researched other project-sharing platforms such as Github and Devpost, and ideated features that would make ProjectHub more effective for community-building within the Fellowship
- Requirements: Having compiled a list of ideas, we drafted a doc of required features and steps, in order to prioritize our tasks effectively.
2. Design:
Before starting to build a UI in Vue.js, we designed our layouts in Figma, a collaborative, online prototyping tool. This helped to visually sync up our ideas so that we could effectively and clearly delegate tasks moving forward.
3. Development:
Having established a clear plan, we divided up the work between our team.
- Front-end: After setting up Nuxt.js, the frontend team took on separate aspects of the Figma design to recreate in Vue.js.
- Back-end: Having established the required DB information and API endpoints, the backend team built a corresponding API to match the front-end.
4. Deployment:
Check out projecthub.tech!
🔨 Challenges we ran into
Some of the main challenges we faced were:
- Two members of our front-end team had never used Figma/Vue.js/Nuxt.js, so using and learning these frameworks/tools was a bit of a blocker at first! Because of this, we also had some difficulties integrating our back-end API with the front-end using Vue.js.
- The back-end team has some trouble with the Github API when auto-filling information from the user’s account. In order to do that, we needed to call more Github APIs and work through restricted permissions.
- Although we all had other things going on (and not to mention in different time zones), we managed to make time for this project and support each other through the process.
💜 Accomplishments that we're proud of
We're extremely proud of our progress, having managed to design and deploy a fully functional web application within 1 week, that consists of a comprehensive combination of UI/UX, APIs, documentation, deployment, and security. We worked well as a team to delegate tasks according to our strengths, while maintaining frequent communication through Discord, Google Meets, and Github.
🎓 What we learned
Throughout this week, each of us learned some new skills and frameworks by building ProjectHub and also through each other. In terms of project development, we also learned the importance of planning and prioritizing our tasks, especially when it comes to designing the UI and adding new features.
🔮 What's next for Project Hub
After this week, we would love to touch up some features and do more testing. Moving forward, we’d also like to promote the platform among fellows and gain user feedback so that we can continue improving ProjectHub. In addition, here are some more of our ideas that we would love to add:
- Connecting fellows on Discord through the site
- Implement in-app messaging
- Release the “Help wanted” feature to let fellows indicate which projects they need help with.
- Build an automated tool to help fellows promote their projects
Log in or sign up for Devpost to join the conversation.