It all started because a Wi-Fi device issue.

Project Overview

This webpage project was created from scratch, manually coded in HTML, CSS, and JavaScript, and is hosted on GitHub. Its purpose is to showcase a structured approach to building a basic website without using website builders. It serves as a practical example for learning and understanding web development fundamentals.

  1. Web Standards – Understand how the web works at a high level and the process for creating web technologies. (Category: Web Standards & Semantics)

  2. Semantic HTML – Learn the fundamentals of HTML to define and structure web content. (Category: Web Standards & Semantics)

  3. CSS Fundamentals – Dive into CSS to style and layout websites. (Category: Styling)

  4. CSS Text Styling – Focus on using CSS for text styling and custom web fonts. (Category: Styling)

  5. CSS Layout – Learn modern techniques for flexible layouts across various devices. (Category: Styling)

  6. JavaScript Fundamentals – Understand the core JavaScript language and its fundamental concepts. (Category: Scripting)

  7. Accessibility – Learn the importance of universal web access and how to write accessible code. (Category: Best Practices)

  8. Design for Developers – Grasp basic design theory, how to communicate in design language, and what makes websites visually appealing. (Category: Best Practices)

  9. Version Control – Understand the necessity of version control and use GitHub for code storage and collaboration. (Category: Tooling)



Purpose and Goals

The main goals of this project include:

  • Demonstrating how to structure a website using HTML and CSS.
  • Implementing interactivity through JavaScript for special effects.
  • Hosting on GitHub to provide open-source access for educational purposes.

Technologies Used

This project incorporates the following technologies:

  • HTML: For content structure and layout.
  • CSS: For styling, including responsive design and animations.
  • JavaScript: For interactive features, animations, and effects.
  • NeoVim with NVChad & VS Code
  • GitHub: For version control and project hosting.
  • Git: For project management.
  • Markdown: Used for writing structured content within Jekyll.
  • Custom CSS (No Frameworks): Clean, manually written CSS instead of utility frameworks like Tailwind.
  • Jekyll: A static site generator for building and managing the website.

About the Developer

This project was created as a personal initiative to explore and improve my skills in web development. Through this project, I aimed to gain hands-on experience with coding, debugging, and understanding the nuances of creating a webpage from the ground up.