Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/glaucia86/live-coding-vuejs-calculadora

Repositório responsável pelo live coding realizado no canal Twitch.tv
https://github.com/glaucia86/live-coding-vuejs-calculadora

azure azure-storage-blob azurewebapp calculadora vuejs2

Last synced: 3 months ago
JSON representation

Repositório responsável pelo live coding realizado no canal Twitch.tv

Host: GitHub
URL: https://github.com/glaucia86/live-coding-vuejs-calculadora
Owner: glaucia86
License: mit
Created: 2019-05-24T22:22:23.000Z (over 5 years ago)
Default Branch: master
Last Pushed: 2023-03-03T05:23:12.000Z (almost 2 years ago)
Last Synced: 2024-11-02T10:24:41.677Z (3 months ago)
Topics: azure, azure-storage-blob, azurewebapp, calculadora, vuejs2
Language: JavaScript
Homepage: https://www.twitch.tv/glaucia_lemos86
Size: 3.73 MB
Stars: 8
Watchers: 2
Forks: 6
Open Issues: 10
Metadata Files:
- Readme: README.md
- License: LICENSE

Awesome Lists containing this project

README

        # Live Coding Twitch.tv: Desenvolvendo uma Calculadora em Vue.js 

[![Evento-Twitch-Glaucia-Lemos.jpg](https://i.postimg.cc/3NMJ8T1G/Evento-Twitch-Glaucia-Lemos.jpg)](https://postimg.cc/XG80LtTN)

Repositório responsável pelo live coding realizado no canal **[Twitch.tv](https://www.twitch.tv/glaucia_lemos86)** 

## Recursos Utilizados no Desenvolvimento da Aplicação 🚀

* **[Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=javascript-0000-gllemos)**

* **[Node.Js](https://nodejs.org/en/)**

* **[Vue](https://vuejs.org/)**

* **[Vue CLI](https://cli.vuejs.org/)**

* **[Azure App Service](https://azure.microsoft.com/services/app-service/?WT.mc_id=javascript-0000-gllemos)**

* **[Extensões Vue.js Usadas no Projeto]**

    - **[Vue 2 Snippets:](https://marketplace.visualstudio.com/items?itemName=hollowtree.vue-snippets&WT.mc_id=javascript-0000-gllemos)**

    - **[Vetur](https://marketplace.visualstudio.com/items?itemName=octref.vetur&WT.mc_id=javascript-0000-gllemos)**

    - **[Vue](https://marketplace.visualstudio.com/items?itemName=liuji-jim.vue&WT.mc_id=javascript-0000-gllemos)**

    - **[Vue VSCode Snippets](https://marketplace.visualstudio.com/items?itemName=sdras.vue-vscode-snippets&WT.mc_id=javascript-0000-gllemos)**

## O que eu vou Aprender?! 📘

Nesse live conding, que será divido em séries de vídeos e posts em Medium, estaremos desenvolvendo uma Calculadura em Vue.js. No final, estaremos realizando o deploy e host da aplicação na Nuvem usando o **[Azure App Service](http://bit.ly/2W3ppi4)**, direto pelo Visual Studio Code.

Essa será a primeira fase de muitos outros projetos em Vue.js que estaremos desenvolvendo no decorrer do ano, visando ensinar, por meio de projetos, do básico ao avançado uma aplicação Vue.js

As fases serão divididas em 4:

* Iniciante (Fase 1)

    - Desenvolvimento de uma Calculadora em Vue.js

* Intermediário (Fase 2)

    - Desenvolvimento de um Todo-List com Vue.js

* Avançado (Fase 3)

    - Desenvolvimento de uma Aplicação MEVN (Mongo, Express, Vue & Node)

* Avaçando+ (Fase 4)

    - Desenvolvimento de uma Aplicação E-Commerce com Vue.js (Conceitos de Serverless)

    

    

## Pré-Requisitos 📕

Para seguir com esse tutorial, se faz necessário tem alguns pré-requisitos. Entre eles saber: HTML, CSS e JavaScript. Caso não tenham, indicarei os dois cursos abaixo:

- **[Criar um site simples usando HTML, CSS e JavaScript](https://docs.microsoft.com/learn/modules/build-simple-website/?WT.mc_id=javascript-0000-gllemos)**

- **[Desenvolver aplicativos Web com o Visual Studio Code](https://docs.microsoft.com/learn/modules/develop-web-apps-with-vs-code/?WT.mc_id=javascript-0000-gllemos)**

## Vídeos da Série 📺

Toda sexta-feira ou domingo, às 22h pelo canal do **[Twitch.tv](https://www.twitch.tv/glaucia_lemos86)** e simultaneamente pelo **[Youtube](https://www.youtube.com/user/l32759)**.

Sempre no final de cada live, estarei escrevendo um post, como desenvolver o projeto passo a passo através do site **[Medium](https://medium.com/@glaucia86)**

Abaixo segue a lista de vídeos já disponíveis:

* **[Desenvolvimento de uma Calculadora com Vue.js - Parte I](https://youtu.be/oEPVTnjIB_8)**

**(Em Desenvolvimento)**

* **[Desenvolvimento de uma Calculadora com Vue.js - Parte II](https://youtu.be/UgK7vt70rN4)**

* **[Desenvolvimento de uma Calculadora com Vue.js - Parte III]()**

* **[Desenvolvimento de uma Calculadora com Vue.js - Parte IV]()**

## Executar Localmente o Projeto 🔥

Caso você deseja executar o projeto na sua máquina local, basta seguir os passos abaixo:

## Começando... 🌀

Para começar, você deve simplesmente clonar o repositório do projeto na sua máquina e instalar as dependências.

## Instalando as Dependências (via Windows): ❗️

Abre o cmd (caso esteja utilizando o Windows) e digite a path do seu projeto

```

cd "C:\Users\NomeDoComputador\Documents\..."

```

Depois, quando estiver na pasta do projeto, basta digitar no cmd a seguinte instrução: **(dentro do calculadora-app)**

```

npm install

```

Ao digitar a instrução acima, automaticamente ele irá baixar todas as dependências listadas e definidas no arquivo package.json:

* `node_modules` - que contêm os packages do npm que precisará para o projeto.

## Executando a Aplicação 💨

Bom, agora na mesma tela do cmd, basta iniciar o server para o projeto ser executado localmente.

```

> npm run dev

```

## Links & Recursos Importantes

## Tenho Dúvidas... O que Faço?! 🚩

Caso tenha dúvidas ao código desenvolvido durante o live coding, sinta-se a vontade em abrir uma **[ISSUE AQUI](https://github.com/glaucia86/live-coding-vuejs-calculadora/issues)** no repositório com a sua dúvida. Assim que possível, estarei respondendo as todas as dúvidas que tiverem!

**(documentação em desenvolvimento)**