Skip to content

README.md

Latest commit

 

History

History
82 lines (59 loc) · 2.89 KB

README.md

File metadata and controls

82 lines (59 loc) · 2.89 KB
Raw

Electronics Store Website

In this repository you can see my first project.

This project was realised as a part of course "Front-End development for school students" and represents a fully static website for a fictional electronics store called "Zhytomyr Electronics Store", located in the Global UA shopping center in Zhytomyr, Ukraine.

The goal of this project was to practice the fundamentals of modern front-end web development — from structuring a multi-page layout to applying custom styles and responsive design — and to bring a real-world business concept to life in the browser.

📸 About the Project

The website presents a local electronics store and includes the following pages:

  • Home — hero section with store name, key info (what, where, when), bestseller products, and a promotional banner
  • About Us — information about the store and its team
  • Services — overview of available services
  • Production — featured products

The site features a responsive navigation bar, social media links (Instagram, VK, Facebook), and smooth hover animations on product images.

🛠️ Technologies Used

  • HTML5 — semantic page structure
  • CSS3 — custom styles, animations (@keyframes), Google Fonts integration
  • Bootstrap 3 — responsive grid, navbar, and layout components
  • Font Awesome — icons used throughout the interface
  • jQuery — included for Bootstrap interactivity

📁 Project Structure

myProject/
├── index.html           # Main homepage
├── About us.html        # About Us page
├── Services.html        # Services page
├── Production.html      # Production/Products page
├── css/
│   ├── main.css         # Custom styles
│   ├── bootstrap.css    # Bootstrap framework
│   ├── About us.html    # (CSS overrides for About Us)
│   ├── Services.html    # (CSS overrides for Services)
│   └── Production.html  # (CSS overrides for Production)
├── js/
│   └── bootstrap.js     # Bootstrap JavaScript
├── fonts/
│   └── glyphicons-*     # Glyphicons icon font (Bootstrap)
└── images/
    ├── duck.jpg / duck.png
    ├── iphone8gold.jpg
    └── sick.png

🚀 How to Run

No build tools or dependencies required. Simply clone the repository and open index.html in your browser:

git clone https://github.com/nzikov/myProject.git
cd myProject
open index.html

Or just double-click index.html in your file explorer.

📚 What I Learned

Through this project I gained hands-on experience with:

  • Building multi-page websites with consistent navigation
  • Using Bootstrap's grid system for responsive layouts
  • Writing custom CSS including animations and Google Fonts
  • Integrating third-party icon libraries (Font Awesome, Glyphicons)
  • Structuring a real-world front-end project from scratch