Skill Swap

Frontend Application, Feb 2026. Role: Front-End Developer.

Skill Swap is a small React app for finding someone to learn a skill from. Visitors browse skills on the home page; signed-in users open a skill's details, see slots and price, and request a session. Users can sign up, log in, reset a password and edit their profile.

Highlights

Email and password sign-up plus Google popup sign-in with Firebase Authentication
Protected routes that remember the requested page and return to it after login
Password rule (upper case, lower case, 6 or more characters) checked before sign-up
Profile page updates display name and photo with Firebase updateProfile
Deployed on Firebase Hosting with an SPA rewrite so deep links work

Main challenge

The main job was a complete authentication flow on the client: sign-up, login, Google sign-in, password reset, profile edits and pages only signed-in users can see, without losing the page a user was trying to reach.

How it was solved

A context provider wraps Firebase Auth and exposes the current user, loading state and auth actions to the whole app. A PrivateRoute component shows a loader while auth state resolves, then either renders the page or redirects to login with the original path in router state, which the login page reads after a successful sign-in. Firebase config is read from environment variables.

What shipped

Live on Firebase Hosting with working sign-up, login, Google sign-in and profile updates
Protected skill details and profile pages with redirect back after login
Built over two days across 20 commits

Built with

React
Vite
React Router
Firebase Auth
Context API
Tailwind CSS
DaisyUI
Firebase Hosting