https://github.com/devmagno/flexblog

🟦 Landing page de um blog fictício para estudo de CSS3 Flexbox.
https://github.com/devmagno/flexblog

adobe-brackets css3 css3-flexbox css3-mediaqueries devmagno html-css-javascript smooth-scrolling

Last synced: over 1 year ago
JSON representation

🟦 Landing page de um blog fictício para estudo de CSS3 Flexbox.

• Host: GitHub
• URL: https://github.com/devmagno/flexblog
• Owner: devMagno
• License: mit
• Created: 2020-11-02T02:44:55.000Z (over 5 years ago)
• Default Branch: main
• Last Pushed: 2020-11-03T19:38:56.000Z (over 5 years ago)
• Last Synced: 2025-01-07T15:24:21.456Z (over 1 year ago)
• Topics: adobe-brackets, css3, css3-flexbox, css3-mediaqueries, devmagno, html-css-javascript, smooth-scrolling
• Language: CSS
• Homepage: https://devmagno.github.io/flexblog/
• Size: 547 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# FlexBlog 🟦







## 📖 Sobre   

O projeto **FlexBlog** foi desenvolvido durante o curso de **CSS Flexbox** da **[Origamid](https://origamid.com)**. Durante o curso, inicialmente é feita uma introdução à todas as propriedades do flexbox (tanto dos _flex containers_ quanto dos _flex items_) e logo em seguida, aplicamos **na prática** os conceitos aprendidos desenvolvendo o **FlexBlog**, um blog fictício feito utilizando somente as **propriedades Flexbox** do **CSS3**, que resulta em um **design inteiramente responsivo** com utilização mínima de _media queries_. Além disso, implementei um scroll suave dos links internos utilizando **JavaScript**.

---

## 🚀 Tecnologias e ferramentas utilizadas

- **HTML5**

- **CSS3 [Flexbox](https://developer.mozilla.org/pt-BR/docs/Web/CSS/CSS_Flexible_Box_Layout/Conceitos_Basicos_do_Flexbox)**

- **JavaScript** (para o scroll suave dos links internos)

- **[Brackets](http://brackets.io/)** 

---

## 🖥️ Demonstração

[![FlexBlog](https://i.imgur.com/DIdmfIb.png "Clique para acessar o projeto")](https://devmagno.github.io/flexblog/ "Clique para acessar o projeto")   

Você pode acessar o projeto clicando [aqui](https://devmagno.github.io/flexblog/).

---

## 🔧 Como executar o projeto

Não há necessidade de executar o projeto, pois você pode visualizá-lo clicando no link acima, mas se ainda desejar fazê-lo, siga as instruções abaixo:

```bash

# Clone o repositório

git clone https://github.com/devMagno/flexblog

# Entre no diretório

cd flexblog

```

Depois disso, utilize uma ferramenta como o [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer) para criar um servidor local e executar o projeto.

---

## 📝 Licença

O projeto está sob a licença MIT. Para saber mais, acesse o arquivo [LICENSE](https://github.com/devMagno/flexblog/blob/main/LICENSE).

---

**Desenvolvido com 💙 por [Guilherme Magno](https://github.com/devmagno/).**