Inspiration
As many developers would attest, having a portfolio is an essential piece to showing off your technical and creative prowess. Portfolios allow developers, designers, engineers - or any other professional for that matter - to share their content with people across the world, adding to the already humming community of innovators and creators everywhere.
What it does
Our hackathon project is a portfolio template that is easily accessible and customizable. For those who may not be as experienced in web development or may be under a tight timeline, our template provides a quick, simple alternative to compiling and publishing a portfolio.
To customize the content of the portfolio, a user simply has to add their information to the _config.yml file and the other yaml files in ./_data in this repository. This will populate the template with contact information, work experiences, projects, and even Google Analytics tracking functionality.
The template is also seamlessly integrated with GitHub pages, allowing end users to go from ground-zero to a fully deployed online portfolio in the blink of an eye. GitHub pages constantly listens for new updates to the target repository, so whenever a user updates the content of their portfolio, a new deployment will be triggered.
How we built it
Let's take a deeper dive into how the portfolio template was made. The static pages and styling are implemented with HTML and SCSS, while the dynamic content of the template is delivered by Ruby and Jekyll. The static pages, which can be found in ./_includes, are injected with dynamic data from the _config.yml file and the yaml files from ./_data. The _config.yml file also links the SCSS styling to the HTML pages, making customization extremely portable.
We also used GitHub for version control and deployment. To create new changes, we utilized feature branches, creating a pull request once the changes were completed. Within each PR, we were sure to tag the issue closed and write a summary of the changes we made. For changes that would directly affect users, we included updates and instructions in the repository README, making our work as transparent as possible. This was essential to our workflow as we primarily worked asynchronously.
Challenges we ran into
One of the greatest obstacles we ran into was time zone differences. Being across the world, there was very little overlap between our available schedules, making it difficult to organize any thorough meetings or pair-programming sessions. However, we overcame this by communicating offline and setting up shorter meetings, where we would coordinate on what actionables we had to take and how we would divvy up the tasks we were assigned. We learned a lot from working with teammates in such different time zones and we gained valuable experience in geographically-challenged product management. Even more, our workflow was a preview how many teams in industry operate today!
Accomplishments that we're proud of
- Google Analytics: When the portfolio is served in production mode, Google Analytics data will be tracked and displayed on a user's Analytics dashboard. This enables a wide variety of data collection, including visitor demographics and site traffic.
What we learned
Not only did we learn the fundamentals of web development with HTML and Ruby, but we also gained valuable experience practicing the best coding practices in a team environment. We learned how to use Git and GitHub to their maximum potential, allowing us to collaborate effectively and efficiently. Moreover, as a result of time zone differences, we practiced many soft skills such as communication and teamwork.
What's next for React Raccoon Team 3
- Deploy our portfolio site using GitHub Pages, Netlify, or Firebase
- Add more style customization features with SCSS
- Create and publish a landing page with template instructions
Log in or sign up for Devpost to join the conversation.