Hexashop

• 

  Home Page

🛍️ About the Project – HexaShop

🔥 Inspiration

One day, I was exploring ways to enhance my development skills and thought of creating a clone of an existing website. That’s when the idea of building an e-commerce website struck me. I named the project HexaShop. While I initially took reference from a Bootstrap template, I started developing the website entirely in my own customized way — designing, structuring, and building every part step-by-step.

💡 What I Learned

Working on HexaShop has been a great learning experience. I gained knowledge in:

• Understanding user thinking and how users interact with a website.
• Building the frontend using HTML, CSS, JavaScript, and Bootstrap.
• Exploring backend development and connecting to databases.
• Applying UI/UX principles to create user-friendly designs.
• Managing both design and code — from layout to functionality.

🧱 How I Built the Project

• Referenced a Bootstrap template but redesigned it with my own ideas and custom code.
• Created product sections, navigation, and responsive layouts.
• Currently working on backend integration using Node.js and MongoDB Atlas.
• Started using Adobe Express to create visual content — like posters, banners, and promotional videos — to elevate the brand identity of HexaShop.

⚙️ Tools & Tech Stack

• Frontend: HTML, CSS, JavaScript, Bootstrap
• Backend (in progress): Node.js
• Database (in progress): MongoDB Atlas
• Design: Adobe Express, Figma

🚧 Challenges Faced

• Converting a template-based idea into a fully customized project.
• Balancing multiple technologies while learning them side by side.
• Understanding the complete flow from design to deployment.
• Adapting a coding project into a design-first presentation for this hackathon.

🚀 Final Thought

HexaShop is still a work in progress, but it has already helped me grow as a full-stack developer and designer. I believe that once completed, it will be a fully functional and visually attractive e-commerce website that provides users with a smooth shopping experience. This hackathon has allowed me to focus on the creative and branding side of the project using Adobe Express, and I’m excited to continue building on it!

Built With

• and-perfect-for-a-hackathon-submission:-##-??-**built-with**-*-**languages:**-html5
• bootstrap
• clear
• css3
• express.js
• express.js-*(planned)*-*-**database:**-mongodb-atlas-*(in-progress)*-*-**design-tools:**-adobe-express
• fair-point!-?-here?s-your-**clean-bullet-point-version**-?-short
• figma-*-**version-control:**-github-*-**deployment-(planned):**-netlify-(frontend)
• github
• html5
• javascript
• javascript-*-**frameworks/libraries:**-bootstrap
• mongodbatlas
• netlify
• node.js
• node.js-*(in-progress)*
• render
• render-or-railway-(backend)-let-me-know-if-you-want-to-add-more-(like-apis-or-animations)
• vercel