TEAM: BALDR
Link to deployed website: https://effulgent-griffin-9fee75.netlify.app/
Link to Figma design: https://www.figma.com/file/0XyJz9MgGwxuHosSaWSMHs/Untitled?type=design&node-id=0%3A1&mode=design&t=QS9dj0X4SOoEx1G7-1
Link to Figma Kanban: https://www.figma.com/file/4zjd37Qr8u1qRo3FD3wDqs/Untitled?type=whiteboard&node-id=0%3A1&t=dYs94PopW43TortC-1
Introduction:
For this course assignment, the task was to develop a social media platform. The challenge involved designing an appealing and responsive user interface, making use of a provided API and its documentation, and include core functionalities like content viewing, posting, editing, and deleting a post.
Design Choices:
The base of our project was inspired by both instagram, facebook and knips’s feeds. We did some research on all three platforms, and combined the components we thought made the most sense. We wanted to have a clean, tidy design.
In the course of our project, we encountered a significant challenge that led us to adjust our priorities. Initially, we had ambitious design aspirations for our project, aiming for a highly intricate and visually appealing user interface. However, as the project evolved, it became evident that our chosen design direction posed technical complexities that consumed a substantial amount of our time and resources. Consequently, we had to make the pragmatic decision to prioritize technical aspects over design intricacies. The necessity to ensure a robust and fully functional website within our time constraints led us to simplify our design and concentrate on core technical elements to guarantee the successful delivery of essential features and functionality. This is why our design’s end result doesn’t match with our Figma design.
Technical:
API and documentation: Our group chose to work with the Tailwind CSS framework in React. The project is based on the Noroff API, which was hard to work with. We faced several problems during the process of fetching, which led us to implement media content from the unsplash random image generator, both for the list of posts, posts specific page and the profile images/avatars - instead of sticking to the media content from the Noroff API which was very unreliable.
Another issue we faced with the API is that we are able to see the new posts we create in the data/Rapid API and in the console, but it’s not showing on our page/UI. A screenshot from Rapid API showing this is attached in the word document report here: https://docs.google.com/document/d/1Qc6LeB29uPCvyyymQSix-jW90LcSkcWpSOfE1eO1fLg/edit?usp=sharing
Branches: We also faced a lot of issues trying to merge our branches to the staging branch. This ended up being extremely time consuming and slowed down our other tasks for this project.
Team effort:
The team effort in our group was good. We all worked evenly throughout the project and showed up to our scheduled meetings/working sessions. We also managed to distribute the tasks evenly. Even though we divided the work tasks within the group, we have primarily worked together on-site at school. We have also been working together on a single computer at times, which may make it look like we haven't individually written the same amount of code. Naturally some of us have written more, but not significantly.
Individual effort:
We worked great as a team, and mostly together, but we naturally had different areas of responsibility.
Bilal:
Bilal had the main responsibility for the register and login page, specifically making the input fields act correctly. He also ensured that once a user was registered, that user could log in with their username and password (with their own profile id).
Håkon:
Håkon has been our error solving king. He has had the main responsibility for fetching API, javascript and merging branches. He also had the main responsibility for the profiles and profile specific page.
Julia:
Julia’s main responsibilities was managing the group’s working schedule, design and styling. She also had the main responsibility for the homepage (list of posts) and post specific page, including query params from the API. We all worked together on all the pages, and also on the create, edit and delete post tasks. Conclusion: We have had a lot of difficulties with pushing, pulling and merging between branches. As a result, we sadly didn’t have enough time to bring our design to life. In retrospect, we should have dedicated even more time to the project. Through this project we have learned a lot about branches, GitHub, and error handling, and also time management.