https://github.com/katarighe/microverse-capstone-project-1
This first capstone project was built from scratch as part of Module 1 of the Microverse Full-Stack Web Development Program, which requires mastery of advanced HTML, CSS, and JS. The project is a website that discusses an upcoming TV and media streaming conference to be held in July 2023 at Crest Towers, Diego Garcia, BIOT.
https://github.com/katarighe/microverse-capstone-project-1
capstone-project microverse microverse-projects microverse-students
Last synced: 4 months ago
JSON representation
This first capstone project was built from scratch as part of Module 1 of the Microverse Full-Stack Web Development Program, which requires mastery of advanced HTML, CSS, and JS. The project is a website that discusses an upcoming TV and media streaming conference to be held in July 2023 at Crest Towers, Diego Garcia, BIOT.
- Host: GitHub
- URL: https://github.com/katarighe/microverse-capstone-project-1
- Owner: katarighe
- License: mit
- Created: 2023-06-26T07:29:12.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2023-07-01T04:37:42.000Z (almost 3 years ago)
- Last Synced: 2025-08-09T02:40:06.892Z (10 months ago)
- Topics: capstone-project, microverse, microverse-projects, microverse-students
- Language: HTML
- Homepage: https://katarighe.github.io/microverse-capstone-project-1/
- Size: 10.8 MB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Microverse Capstone Project (Module 1)
laxACT Streaming Conference 2023
# 📗 Table of Contents
- [📖 About the Project](#about-project)
- [🛠 Built With](#built-with)
- [Tech Stack](#tech-stack)
- [Key Features](#key-features)
- [🚀 Live Demo](#live-demo)
- [💻 Getting Started](#getting-started)
- [Prerequisites](#prerequisites)
- [Setup](#setup)
- [Run tests](#run-tests)
- [Deployment](#deployment)
- [👥 Authors](#authors)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#support)
- [🙏 Acknowledgements](#acknowledgements)
- [📝 License](#license)
- [🖼️ Project Gallery](#gallery)
# 📖 Microverse Capstone Project (Module 1)
> This is the First Capstone Project of Microverse, a fictional conference website done with a combination of HTML/CSS/JS langauges, as well as using web applications and configurations to keep the project functioning.
Capstone Project (Module 1) is a website that announced for the upcoming TV streaming conference organized by laxACT Ltd., a local IT company that specializes in multimedia technology. The conference will be held from July 4 to 7, 2023 at the Crest Towers, Diego Garcia, BIOT. General information about the conference and the organizer is detailed throughout the first two pages of the site. There are additional sections of the website which includes joining this years conference and contacting the company responsible for holding the conference. However, these sections are still under construction and will be updated in the future.
The content inside the website is fictional, as the photos of Speakers, Partners, and, etc. are randomly obtained through [Google Images](https://images.google.com/). The project was created using HTML, CSS, and JavaScript in order to meet [the requirements defined](https://github.com/microverseinc/curriculum-html-css/blob/main/capstone/html_capstone.md) within the scope of the [Microverse Capstone Project](https://github.com/microverseinc/curriculum-professional-skills/blob/main/becoming-a-remote-professional/capstone-projects-at-microverse.md). More specially, I would like to point out that the website I create is done from scratch, but just to make it similar according to original design by Cindy Shin on Behance. See [Acknowledgements](#acknowledgements) for more details.
Capstone Project (Module 1) is built as part of the 12-month Microverse Full-Stack Web Development Program. The mobile project was first applied in this project, followed by the desktop one.
### Tech Stack
This capstone project is built and configured using the following tools:
Languages
Development Applications
Git / GitHub
Web Configuration Applications
The three key features used in my personal portfolio project include:
- An interactive mobile menu page.
- An interactive photo gallery about laxACT's previous streaming conferences.
- Storing the details of conference speakers through 1 separate JS file.
The Live Demo of this Capstone Project is available now on GitHub Pages and Loom.
- [Live Demo Link on GitHub pages](https://katarighe.github.io/microverse-capstone-project-1/)
- Video Presentation of the Website on Loom: [Part 1](https://www.loom.com/share/2b5bd417bf114a779da6f25fd133a94b?sid=24aa233a-cee4-435e-abd0-a847ecfc6e94) [Part 2](https://www.loom.com/share/1223f8d85cd740cb80d3781659791e15)
The project that you are going to build is based on an online website for a fictitious non-existent media streaming conference. This repo provides some of the design guidelines for you to create the website. It is very important that when you personalize your project, it must have something unique in your portfolio to share with potential employers during the job searching process.
To get a local copy of this project up and running, follow these steps.
### Prerequisites
In order to run this project you need:
- To have Visual Studio Code (VSC) ready while loading the project.
- To have a preferable web browser ready while viewing the project. Microsoft Edge and Google Chrome (their latest version) are considerd the best web browsers for viewing.
- GitHub Desktop also be used as an option, but VSC is recommended code editor because of their git capability, as well as configuring the Web Linters (Lighthouse/Stylelint/Webhint/ES Lint).
Also, these basic requirements are needed in order to fully understand how the project fully works from the start:
- Should have a basic knowledge of HTML, CSS, and JS (JavaScript).
- Also, it is recommended to have a basic knowledge on how Git and GitHub works.
### Setup
Before starting with the project, follow these instructions:
- [Visual Studio Code Download Link](https://code.visualstudio.com/download/)
- [How to Install Visual Studio Code on Windows 7/8.1/10/11](https://www.youtube.com/watch?v=MlIzFUI1QGA/)
- [GitHub Desktop Download Link](https://desktop.github.com/)
- [Instructions on Using GitHub Desktop easily](https://www.youtube.com/watch?v=RPagOAUx2SQ/)
Clone this repository to your desired folder:
- git clone git@github.com:katarighe/microverse-capstone-project-1.git
Install this project with Visual Studio Code:
- On the Visual Studio Code welcome page, select "Clone Git Repository" and click.
- Paste the copied repo into the textbox and click "Clone from GitHub" on the top.
- Choose which folder where you are going to save the cloned GitHub Repository into your local PC.
- Wait for the setup to be complete until it downloads all the content entirely from the GitHub server.
### Run tests
To run the project through the web browser, follow these instructions:
- Press "Go Live" on the bottom of the visual Studio Code.
- The program will open on the browser of your choice, such as Microsoft Edge, Google Chrome, Mozilla Firefox, Opera or Brave.
- However, the project will load on Microsoft Edge by default. If you wish to view the project on a different browser,
copy this (http://127.0.0.1:5500/) address on the Edge browser and past it to your web browser of your choice.
- If you want to view the project on smartphone mode, right click your mouse and select "Inspect". Once it is opened, you
can view the website in mobile mode, the default size of a mobile version is set at 375x768 while desktop format is at 1024x768.
### Deployment
You can deploy this project using [GitHub Pages](https://pages.github.com/), it is free and easy to apply in your project without difficulties.
👤 **Mohamed Aden Ighe**
- GitHub: [@katarighe](https://github.com/katarighe)
- Twitter: [@katarighe](https://twitter.com/katarighe)
- LinkedIn: [@mighe](https://linkedin.com/in/mighe)
Contributions, issues, and feature requests are welcome!
Feel free to check the [issues page](https://github.com/katarighe/microverse-capstone-project-1/issues).
Give a star⭐️ or a thumbs up 👍 if you like this project! You can visit my GitHub profile for more of my projects.
- Project supervised by [Microverse](https//www.microverse.org/)
- Original design theme is by [Cindy Shin on Behance](https://www.behance.net/adagio07/)
- Link to the original design theme by C. Shin is available [here](https://www.behance.net/gallery/29845175/CC-Global-Summit-2015/)
- [Creative Commons 4.0 License](https://creativecommons.org/licenses/by-nc/4.0/)
This project is MIT licensed.
The homepage section will be shown only as a sample for this project. If you would like to view the rest please visit my live demo linked located inside of the README file.
**Mobile Version**
**Desktop Version**
