holberton-smiling-school
Author Description
- I'm a software engineering student at Holberton School, with 2 years of experience in Javascript web technologies.
- I'm mostly confident with JavaScript (MERN Stack) and Python and I'm looking for a full time software engineering job.
- You can reach me out on:
Project Description
- This is a fullstack web specialization project at Holberton school.
- The goal of this project is a implement a Figma design template in HTML, CSS and Bootstrap
- The project has no guiding instructions.
- There are 3 page to implement.
- There are 3 different layout (desktop, tablet and mobile) for each page.
Technologies and Concepts
- HTML.
- CSS.
- Bootstrap.
- Javascript & Jquery.
- Responsive design for web, tablet and mobile.
Features
- All the required features for this project are implemented.
Challenges
- The most challenging part is the responsive design part.
- How to write good reusable CSS classes.
- How to make a clean HTML structure.
Usage and Installation
- There's no installation needed to use this project. You just have to download the zip file of the project or clone the project and open it on the browser.
Clone
git clone https://github.com/Edin93/holberton-smiling-school-javascript.git
Requirements
- We have to use Bootstrap.
- Our styles.css must be as small as you can - we must use as much as we can Bootstrap classes.
- The web pages have to be responsive.
- Will have import fonts from Google, JQuery and Bootstrap CSS/JS.
Best practices to follow for this project
- Use Bootstrap as much as possible.
- Use personalized CSS as little as possible.
Design informations
- Web pages must switch to the tablet version when the screen width is 768px
- Web pages must switch to the mobile version when the screen width is 576px
- button hover/active: opacity: 0.9
Pages Designs Screenshots
Homepage Designs
Homepage desktop design
Homepage tablet design
Homepage mobile design
Courses Designs
Courses desktop design
Courses tablet design
Courses mobile design
Pricing Designs
Pricing desktop design
Pricing tablet design
Pricing mobile design
