Full Stack Development Project — Front end
The purpose of this Full Stack project was to create a simple, yet refined, web application to post and share links, using frameworks such as React, Nodejs and Postgresql.
To summarize, there are a few key components that made building this project a challenge:
- The given prompt was split in two parts: in the first week, there were a set of requirements to be met, and in the second week, there were a set of features to be implemented upon the initial build. In both weeks, these requirements/features were presented as Sprints, which were achieved by using sprint planning tools such as Trello.
- As a team, we had to research, plan out, and implement the features of the application from the ground up, both Back End and Front End. As a result, multiple team-work coordination skills were required, as well as the ability to communicate with the team and the client (in this case, the client is the user)
- As a concept, the platform required a fully-featured, user-friendly interface, with a robust database and website enviroment. Hence, the project was refactored twice, to acommodate the new requirements.
- Main page
- Timeline displaying the most recent posts from the users that the user is following.
- Trending sidebar displaying the most engaged hashtags.
- Posts
- Each post has a sections for its number of likes, comments, shares.
- Hashtags are highlighted and interactive.
- Each of these sections is interactive, and can be expanded by clicking or hovering on the icon.
- The post content is editable and deletable only by the user.
- Comments
- Comments are always displayed from the most recent to oldest.
- A comment sent by the same user that created the post has a unique icon.
- A comment sent by an user that the user is following has a unique icon.
- Reshares
- A reshared post is visible to users who do not follow the post's author.
- Each share has a unique header, displaying the user that shared the post.
- Hashtags
- Aswell as interactive, the hashtags are constantly updated, taking into account both the number of posts and the number of likes on each of them.
- Each hashtag has a unique page containing all posts with that hashtag.
In this section I included all Youtube content I used or refered to while studying for this project, aswell as my main contact mediums. Keep in mind that most of these videos contain information that was not previously studied during class, which may affect some parts of the code that contain these extras.