Skateboarding Store Landing Page - Hackathon 1

Project Description

This project consists of building a responsive landing page for an online sports store focused on skateboarding products.
The page will be developed using:

• HTML for structure
• CSS for custom styling
• Bootstrap for responsive layout and components
• JavaScript for interactive features

The goal is to create an attractive, organized, and functional landing page that showcases products and encourages users to explore and buy.

---

Checklist - Landing Page Hackathon 1

1) Page Structure (HTML)

The landing page must include at least the following sections:

• Navbar / Menu
• Hero section or main banner
• Products section
• Information / benefits / offers section
• Contact section (form or contact information)
• Footer

2) Page Content

The page must include:

• Store name
• Product images
• Product names
• Prices
• Action buttons (Buy, Add to Cart, View More)
• Descriptive texts
• Logo or main title
• Contact form or contact details

3) CSS (Design)

The page must include styling such as:

• Color palette
• Typography
• Product cards
• Styled navbar
• Styled buttons
• Hover effects on buttons or products
• Clean and organized layout
• Use of Flexbox or Grid
• Centered and well-structured page design

4) JavaScript (Interaction)

The page must include at least 1 or 2 JavaScript interactions, for example:

• Add to cart button -> alert message
• Change color on click
• Show message
• Animation
• Responsive menu behavior
• Modal window
• Counter
• Slider
• Show/hide information

5) GitHub Requirements

The project must:

• Be hosted in a GitHub repository
• Include commits
• Include a README file
• Include all project files
• Be developed in a team (if applicable)

---

Suggested Project Structure

hackathon/
├── index.html
├── css/
│   └── styles.css
├── js/
│   └── script.js
├── assets/
│   ├── images/
│   └── logo/
└── README.md

Main Objective

Create a modern and responsive skateboarding store landing page that combines good visual design, clear information architecture, and basic JavaScript interactivity.