This is an online conference website. They user has sections to describe the conference, add the main program, add speakers and sponsors and also include contact information.

  • By Tracy Musongole
  • Last update: Dec 27, 2022
  • Comments: 4

Capstone-project-1

This is my first capstone project in the microverse curriculum. It tests all the knowledge I have gained in HTML, CSS and Javascript. I am a blockchain enthusiast so I made the theme of the website an online blockchain conference. Below I have shown a screenshot of what the home-page tooks like.

.

Built With

  • HTML & CSS
  • Javascript
  • Github

Live Demo

https://elfin-git.github.io/Capstone-project-1/

To get a local copy up and running follow these simple example steps.

Prerequisites

  • Github flow knowledge. -Intermediate CSS, HTML and Javascript. -Installation of linter files.
  • Use of the Behance template

Setup

Install

  • Set up Github Actions
  • Set up linter > Lighthouse , Webhint ,Stylelint , Eslint.

Author

馃懁 Tracy Musongole

馃 Contributing

Contributions, issues, and feature requests are welcome!

Feel free to check the issues page.

Show your support

Give a 猸愶笍 if you like this project!

Acknowledgments

  • Hat tip to anyone whose code was used
  • Credit to Cindy Shin on behance , my web design is inspired by her project.
  • Credit to Junik Studio on behance , their cryptocurrency icons were used in the making of this project
  • Good old uncle Google -My learning partners for this week.

馃摑 License

This project is MIT licensed.

Github

https://github.com/elfin-git/Capstone-project-1

Comments(4)

  • 1

    Feature: I made the home page and about page of a conference website

    Note: I used other branches to make some other features but I will mention all the changes here.

    • I first created the mobile layout of both the home and the about page.
    • I used javascript, html and css to implement the slide in toggle menu.
    • I then went ahead and styled the desktop version using media queries.
    • I dynamically created the featured speakers section using javascript.
  • 2

    Toggle menu: I added the toggle menu and implemented the desktop version

    • I implemented the desktop version for both about and home page using media queries.
    • I implemented a toggle menu for both pages.
    • I fixed some linter errors
    • I installed eslint.
  • 3

    About page: I added the about page of the project

    • The intro section was the same as in the home page, just a few style changes
    • I added the logo of the conference
    • I added the section with the partners'logos
    • I added the footer
  • 4

    Home page. I adapted the home page to the mobile version

    • I added the nav bar and hamburger menu.
    • I created the opening titles and paragraphs.
    • I then added the date and avenue of the event.
    • I added the program schedule
    • I added a button to sign up for the event.

Popular Tag

Related