Hobby Swap: By using Google Gemini

• 

  Html code

• 

  CSS code

Inspiration

The idea for Swap Hobby came from noticing that many people want to learn new skills but cannot afford courses or subscriptions. At the same time, many people already have skills they would love to share. I wanted to build a simple platform where people can teach what they know and learn something new in return, without money—just skill exchange and community learning.

What I Learned

While building this project, I learned how a complete frontend application works without a backend. I understood how to store and manage data using local Storage, handle user authentication logic, and update the UI dynamically using JavaScript. I also improved my understanding of HTML structure, CSS styling, and JavaScript event handling.

How I Built the Project

I built Swap Hobby using HTML, CSS, and JavaScript only. The user interface is created with HTML and styled using CSS for a clean and responsive design. JavaScript is used to manage users, login/logout, swap requests, filters, and notifications. All data such as users and requests are stored in the browser using localStorage, so no database or server is required.

Challenges I Faced

One of the main challenges was managing user state and swap requests without a backend. Handling login sessions, notifications, and request status updates using only browser storage was difficult at first. Another challenge was keeping the UI responsive and updating it correctly after every action. Solving these problems helped me understand real-world application logic much better.

Built With

• css
• html
• html5
• javascript
• sqlite