Open Sourced Olaf - Pod Portfolio

A HORIZONTAL portfolio Website to showcase the projects created by the members of our pod along with their details.

Comment

Inspiration

In the fellowship as along with our pod mates as we will be creating several projects so we needed a platform to showcase our work. So we decided to built a portfolio website for rather than just ourselves but for the whole pod.

A portfolio could be considered as a book having some specific chapters of a developers career and, traditionally the pages of book are turned horizontally rather than vertically So we decided to make it an Horizontal Portfolio Website

What it does

Currently its a static website where visitors are able to see the details of members of pod 2.1.2 along with the projects that they have worked on

How we built it

We built using React framework, CSS for styling and JSON file to get data from, and display it on UI. there is a major role of CSS grid and flex properties to make it horizontally happen.

Challenges we ran into

Creating a horizontally scrollable website wasn't and easy task as there was simultaneous use grids as well as flex.

Accomplishments that we're proud of

The website looks quite pretty and the idea is out of the box, so converting this idea into reality is the thing we are most proud of.

What we learned

  • Creating a scrollable website
  • Keeping a .gif file as image backgorund
  • Mapping the json data and rendering a single React component time the object present in json file
  • Changing cursor to a desired emoji or image

What's next for Open Sourced Olaf - Pod Portfolio

  • Making website responsive
  • Adding a feature of a character with the help of whom visitor will be able to navigate the website and the character will be controlled by arrow keys
  • Adding more collaborators to make this project more dynamic, efficient and user friendly
Share this project:

Updates