Bootstrap-Project

KO | EN

gitlite — search

#python #hacktoberfest #golang #rust #deep-learning #docker #nodejs #windows #awesome #cli #kubernetes #vue #awesome-list #openai

Bootstrap-Project

(★ 13)

In this exercise, I will experience the power of using a CSS framework like Bootstrap to create a new website quickly from scratch. I'm going to create a prototype of the portfolio website from scratch in a few hours.

Bootstrap-Project Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# 📗 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)
- [👥 Authors](#authors)
- [🔭 Future Features](#future-features)
- [🤝 Contributing](#contributing)
- [⭐️ Show your support](#support)
- [🙏 Acknowledgements](#acknowledgements)
- [❓ FAQ (OPTIONAL)](#faq)
- [📝 License](#license)

# 📖 Try Bootstrap <a name="about-project"></a>

In this project, we applied some bootstrap components (cards, buttons, badges). Also we established a connection among css and preprocessors(SASS, SCSS) using an extension "Live Sass Compiler" in vscode.

## 🛠 Built With <a name="built-with"></a>

### Tech Stack <a name="tech-stack"></a>

<details>
 <summary>Client</summary>
 <ul>
 <li><a href="https://www.hostinger.com/tutorials/what-is-html">HTML</a></li>
 <li><a href="https://www.hostinger.com/tutorials/what-is-css">CSS</a></li>
 <li><a href="https://www.hostinger.com/tutorials/what-is-bootstrap">Bootstrap</a></li>
 <li><a href="https://www.hostinger.com/tutorials/what-is-preprocessor">Preprocessors</a></li>

</ul>
</details>

<details>
 <summary>Server</summary>
 <ul>
 <li>N/A</li>
 </ul>
</details>

<details>
<summary>Database</summary>
 <ul>
 <li>N/A</li>
 </ul>
</details>

### Key Features <a name="key-features"></a>

- **Follow a correct Gitflow**
- **Use Bootstrap components**
- **Use Preprocessors**
- **Use Transitions**

(<a href="#readme-top">back to top</a>)

## 🚀 Live Demo <a name="live-demo"></a>

- [Live Demo Link](https://carlosigreda.github.io/Bootstrap-Project)

(<a href="#readme-top">back to top</a>)

## 💻 Getting Started <a name="getting-started"></a>

To get a local copy up and running, follow these steps:

### Prerequisites

In order to run this project you need:

✅ Github account 
✅ Visual Studio Code installed 
✅ Node.js installed 
✅ Git Bash installed (optional)

### Setup

Clone this repository to your desired folder:

```sh
  cd [my-folder]
  git clone git@github.com:CarlosIgreda/Portfolio-setup-and-mobile-first.git
```

(<a href="#readme-top">back to top</a>)

## 👥 Authors <a name="authors"></a>
**Carlos Igreda**
- GitHub: [@CarlosIgreda](https://github.com/CarlosIgreda)
- Twitter: [@carlosigreda](https://twitter.com/carlosigreda)
- LinkedIn: [@carlosigreda](https://www.linkedin.com/in/carlosigreda)

**Dany Augustin**
- GitHub: [@amiralda](https://github.com/amiralda)

**Hernán Güemes**
- GitHub: [@HFG43](https://github.com/HFG43)

(<a href="#readme-top">back to top</a>)

## 🔭 Future Features <a name="future-features"></a>

- [ ] **Interaction using Javascript**

(<a href="#readme-top">back to top</a>)

## 🤝 Contributing <a name="contributing"></a>

Contributions, issues, and feature requests are welcome!

Feel free to check the [issues page](../../issues/).

(<a href="#readme-top">back to top</a>)

## ⭐️ Show your support <a name="support"></a>

If you like this project you can follow me on Github.

(<a href="#readme-top">back to top</a>)

## 🙏 Acknowledgments <a name="acknowledgements"></a>

I would like to thank all Microverse staff and my learning partners as well.

(<a href="#readme-top">back to top</a>)

## ❓ FAQ <a name="faq"></a>

- **What is a Linter?**

- Linter is a tool that analyzes source code to flag programming errors, bugs, stylistic errors, and suspicious constructs.

- **What is meant by Gitflow?**

- Gitflow is an alternative Git branching model that involves the use of feature branches and multiple primary branches.

- **How to use flexbox?**

- The main idea behind the flex layout is to give the container the ability to alter its items’ width/height (and order) to  best fill the available space (mostly to accommodate to all kind of display devices and screen sizes). A flex container expands items to fill available free space or shrinks them to prevent overflow.

- **What is grid layout?**

- CSS Grid Layout excels at dividing a page into major regions or defining the relationship in terms of size, position, and layer, between parts of a control built from HTML primitives.

- **What is hover effect?**

- Creating CSS link hover effects can add a bit of flair to an otherwise bland webpage. If you’ve ever found yourself stumped trying to make a slick hover effect, then I have six CSS effects for you to take and use for your next project.

- **What is form validation?**

- When you enter data, the browser and/or the web server will check to see that the data is in the correct format and within the constraints set by the application. Validation done in the browser is called client-side validation, while validation done on the server is called server-side validation. In this chapter we are focusing on client-side validation.

- **What is UX?**

- User experience (UX) design is the process design teams use to create products that provide meaningful and relevant experiences to users.

- **What is media query?**

- Media queries allow you to apply CSS styles depending on a device's general type (such as print vs. screen) or other characteristics such as screen resolution or browser viewport width.

- **What is accessibility?**

- Accessibility is essential for developers and organizations that want to create high quality websites and web tools, and not exclude people from using their products and services.

- **What is Bootstrap?**

- Powerful, extensible, and feature-packed frontend toolkit. Build and customize with Sass, utilize prebuilt grid system and components, and bring projects to life with powerful JavaScript plugins.
 
(<a href="#readme-top">back to top</a>)

## 📝 License <a name="license"></a>

This project is [MIT](./LICENSE) licensed.

(<a href="#readme-top">back to top</a>)

Bootstrap-Project

Bootstrap-Project Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Bootstrap-Project

Bootstrap-Project Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README