Skip to content

CodeInstitute Milestone project no.1 - Monkees, the famous band website

Notifications You must be signed in to change notification settings

WiiW337/monkeesbandweb

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

50 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

THE MONKEES WEBPAGE

My goal to create this website to let the fans can easily follow their favourite band, The Monkees.

Visit the webpage

UX

USER STORIES

As a fan of the band, he/she can pick 1 of the selection from the menu on top to:

  • get more information of the band's member.
  • know latest photo/music/video from the band.
  • get detail about the latest event from the band.
  • contact/hire the band for function like birthday party/wedding party.

Mockup & Wireframes

The website wireframes were created by using Balsamiq.

Page 1 - Home

Page 2 - Media

Page 4 - Contact

Page 3 was added after done in wireframe design. This page is using the same design with other pages, just different in

part.

Features

HOME Page

Let the user to know more about the band's member info.

MEDIA Page

Let user to listen band's music, band's music video, & some of the band's photo.

Event Page

Let user know more details about coming events of the band such as Date & Place.

CONTACT Page

Let user to hire the band for perform in the party and list out some of the official social website such as facebook, instagram, & youtube to let fan follows.

Technologies Used

Technologies i used on this website is listed as below:

  • HTML5 - The create the structure & layout of website.
  • CSS - Style the website to make more interesting.
  • jQuery - To make the navbar work
  • Popper.js - To make the navbar work
  • Bootstrap - Grid system of bootstrap make the job don easily, & some useful classes from bootstrap also help alot.
  • Google Fonts - To make the font on the website look more interesting & different in different section.
  • Git - Allow me to store my code into Github.

Testing

  • The site was tested on Google Chrome browser.
  • Tested with different device screen size like desktop, tablet, & phone, fit into the screen.
  • Links in HOME page was tested & is work.
  • Music & Video in MEDIA page also tested & is work too.
  • Form in CONTACT page was tested by no enter any info or wrongly enter information, the form will notify user.
  • Social media links in CONTACT page is tested & work. Browser will open a new tab for the social media website.
  • Also tested by other user from community of slack.

Deployment

The website was developed using Visual Studio Code. I also use Git to save my code in Github.

Git command that i used in this project:

  • git add 'filename' - track the new/edited file
  • git commit - to commit the changes
  • git push - push the code to github

In Github setting, i activated an useful feature of github, Github Pages, this allow my project deploy to a website. Now, my project is hosted using Github Pages, deployed directly from the master branch. View

You can copy my project into IDE that you using, you just have to:

  1. Open my repository on github. Here
  2. Click a button name Clone or download.
  3. Copy the clone URL for the repository.
  4. Go to IDE that you are using & open the terminal.
  5. Make a new folder to clone my project.
  6. Type git clone https://github.com/WiiW337/monkeesbandweb.git
  7. My project will be cloned into your local repository.

Credit

Content

  • Member details were copied & link from wikipedia

Media

About

CodeInstitute Milestone project no.1 - Monkees, the famous band website

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published