Visual Studio Code
React
TypeScript
JavaScript
Tailwind CSS
MySQL
Axios
Express
Sequalize
Bcrypt

Trumpeter Social Media App

Speak Loud, Be Heard, Stay Connected.

Objective

The objective was to create a comprehensive social media platform that allows users to register, log in, post updates, and interact with other users’ content. The app aims to be intuitive, engaging, and secure, providing a seamless user experience from registration to daily interactions.

Design

The design focused on creating a user-friendly interface that is appealing and functional. Key features such as a post feed, user profiles, and real-time notifications were implemented to enhance user engagement. The layout is clean and navigable, making it easy for users to find and interact with content.

Development

Developed using a React-based frontend and a Node.js/Express backend with MySQL for database management. User authentication was implemented using JWT tokens for secure access and session management. RESTful API endpoints were created to handle user data and posts.

Challenges

A major challenge was implementing conditional rendering for edit and delete buttons on users’ posts when logged into their accounts. The goal was to ensure these controls were only visible to the user who created the post, which required precise control over UI components based on user authentication status.

Breakthroughs

I successfully solved the conditional rendering issue by incorporating checks that compare the currently logged-in user's ID against the post creator's ID. This approach secured the application and enhanced the user experience by tailoring the interface to user-specific interactions.

Outcome

Trumpeter is now a fully functional social networking service that provides a secure and engaging platform for users to express themselves and interact with others' content. It showcases advanced full-stack development skills, with a focus on security, user experience, and modern web practices, particularly in interactive content management.