HappyHandsMnl v1

Technologies and Concept

JavaScript
React
HTML5
CSS
Netlify
Facebook Messenger

Specification

Happyhandsmnl's website showcases the company's wide array of eco-friendly products. Since the primary service of the company is product personalization, the user can try out a different set of fonts that best suit his purchase. The user can also place his order on the website's contact page.

Challenges

This was my first project that was created from scratch. UI components namely, the modal, navigation bar, and the others were created without the use of a framework such as Tailwind and Bootstrap. The touch events and the other functionalities were created from vanilla JavaScript. It may look like reinventing the wheel but the goal in mind is to fully grasp the fundamentals of HTML, CSS, and JavaScript. Also, to deeply understand how things work behind the scenes. It was a great opportunity for learning because it allowed me to have a solid understanding of the basics. As a result, it provided me to have the flexibility of learning or using a new framework. In line with this, the project was created with React. Instead of trying to learn React through tutorials and replicating the project incorporated on it, I preferred to study React in such a method because experiencing bugs and debugging is a skill that as important as learning the library. With thorough research, I have used different React hooks such as useRef, useEffect, and others.

Responsibilities

  • Overall Development
  • Layout, UI and UX design
  • Responsive Design
  • Deployment