This is my personal Project from module 1, in which I created a Web Page for my former band called "VPN" in which I promote a world tour concert! check it out!

  • By Juan Sebastian Sotomayor
  • Last update: Apr 11, 2022
  • Comments: 2

My Band Page

Here is my Capstone Project for module 1, In this project I build a mobile and desktop vesion of a website using all the things that I learned like CSS, HTML and JavaScript.

Built With

  • HTML
  • CSS
  • Git
  • JavaScript

Getting Started

In this repository I will create a web page for VPN Live Concert.

Run it

Use the following steps to run this Project locally:

  • Create a directory

  • Open the terminal

  • Run this command: git clone [email protected]:Juanse7793/My-Band-World-Tour.git

  • Enter in to the folder: cd My-Band-World-Tour

  • Open the folder with a code editor (VS Code preferred)

  • Go to the index.html file and open it with live server

Demo

Here you have a Live Demo of the Band Page

Author

👤 Juan Sebastian Sotomayor

Presentation

Click here to see the Video of the Capstone 1 Project

🤝 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Ackmowledgments

Licence

This project is MIT licensed.

Show your support

Give a ⭐️ if you like this project!

Github

https://github.com/Juanse7793/My-Band-World-Tour

Comments(2)

  • 1

    Capstone Project module 1

    Capstone Project

    Hi, here I add the following information:

    • index.html
    • about,html
    • style.css
    • styleAbout.css
    • menu.js
    • script.js
    • images folder
    • mit.md

    Description

    here is my capstone project where I made a webpage for the former band where I used to play the drums :smile: (good memories come to my mind everytime I see the page:crying_cat_face:).

    here are all the requirements that these pages (home & about) fulfill:

    Desktop 769px +

    • The home page has a link in the menu to the about page.
    • The logo in the header links to the home page.

    Mobile menu 768 -

    • When the user clicks (or taps) the hamburger button on the header, the mobile menu appears over the page.
    • Implemented and consistent with the design (colors, typography, spacings, etc.).
    • The mobile menu has a close (X) button that closes the menu.

    Dynamic page

    -The section "Band Members" is created dynamically in JavaScript. -I use JavaScript variable with the data about the band members and use it when the page loads to create the HTML for this section dynamically.

  • 2

    Peer review Tafara, Retky, Issac, Juan

    • On the about page the width is bigger than the screen.

    • A part of the close menu in the mobile version is covered by the ul element, making it unable to close when clicking some parts.