Create with pure code!

For these projects, always use vanilla code. Avoid use any library or frameworks like jQuery, React, Angular, Vue, Bootstrap, Foundation, etc.

How To?

Choose an idea in the repository, create, finalize, and send us to include in the completed projects.

Collaborate with projects in progress

Click here to see the projects that are in progress and contribute!

Ideas

Beginner

Html, CSS and JavaScript

• Create a Simple Website. (With Header, Nav, Article, Aside, Footer...)
  
• Create a Body Mass Index (BMI) Calculator.
  
• Copy a site you like, without looking at the source code.
  
• Create a To Do List.
  
• Create a Price Table like this using FlexBox.
  
• Get your current position using the Geolocation API.
  
• Save your data to the browser using Local Storage API.
  

JavaScript

• Generate a Json (https://www.json-generator.com/) and use XMLHttpRequest to show the json file in your website.

CSS

• Create a Photo Gallery.
  
• Look a CodePen and copy something that you think is nice, without seeing the code.
  
• See a layout in dribbble and write the code.
  
• Create a Modal without JS.
  
• Create a text with gradient colorful.
  

Intermediate

• Create a url shortner website (using a external shortner API)

Advanced

• Create a url shortner website (make your own API with node.js)

Crie com código puro!

Para este projeto, sempre utilize o código vanilla. Evite usar bibliotecas e frameworks como jQuery, React, Angular, Vue, Bootstrap, Foundation, etc.

Como fazer?

Escolha uma ideia do repositório, crie, finalize e envie para que nós possamos incuir nos Projetos Completos.

Colabore com os projetos em progresso

Clique aqui para ver os projetos que estão em progresso e contribuir!

Ideias

Iniciante

Html, CSS e JavaScript

• Crie um Website simples. (Que possua: Header, Nav, Article, Aside, Footer...)
  
• Crie uma Calculadora de Índice de Massa Corporal (IMC).
  
• Copie um site que você goste, sem utilizar o código fonte.
  
• Crie uma lista de afazeres.
  
• Crie uma tabela de preço como esta utilizando o Flexbox.
  
• Utilize uma API para obter sua localização atual.
  
• Salve seus dados no navegador utilizando uma API de Armazenamento Local.

JavaScript

• Crie um arquivo Json(https://www.json-generator.com/) e use XMLHttpRequest para mostrar o arquivo Json na sua página Web.

CSS

• Crie uma galeria de fotos.
  
• Pesquise no CodePen e copie algo que você acha interessante, sem utilizar o código fonte.
  
• Veja um layout no dribbble e crie o código.
  
• Crie um Modal sem utilizar JavaScript.
  
• Crie um texto fazendo um gradiente de cores.
  

Intermediário

• Crie um site que encurtem URL'S (utilizando uma API externa de encurtador de URL's)

Avançado

• Crie uma página que encurte URL'S (Faça sua própria API com Node.js)