Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/eugenia1984/vue-school
Here you will find all my practices with VUE.js from https://vueschool.io/ and Fernando Herrera
https://github.com/eugenia1984/vue-school
css3 html5 javascript vue vue-router vue3 vuejs
Last synced: 16 days ago
JSON representation
Here you will find all my practices with VUE.js from https://vueschool.io/ and Fernando Herrera
- Host: GitHub
- URL: https://github.com/eugenia1984/vue-school
- Owner: eugenia1984
- Created: 2024-09-11T18:07:20.000Z (4 months ago)
- Default Branch: main
- Last Pushed: 2024-10-03T15:42:37.000Z (3 months ago)
- Last Synced: 2024-10-31T04:23:48.943Z (2 months ago)
- Topics: css3, html5, javascript, vue, vue-router, vue3, vuejs
- Language: HTML
- Homepage:
- Size: 734 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# VUE SCHOOL
Here you will find my Vue.js practices with [vueschool.io](https://vueschool.io/courses/) and some videos of **Fernando Herrera**.
---
## What you can find?
1. The **01 - Vue.js Fundamentals with the Composition API course** covers:
```
- Introduction to two-way data binding
- Template syntax and expressions
- Vue directives, loops and conditional rendering
- Vue Devtools
- Handling user Inputs
- Handling Events
- Vue.js Methods and Computed Properties
- Attribute Bindings and dynamic classes
```Creating a to-do app to see all this concepts.
2. **02 - Vue Fundamentals API composition**:
- `v-bind`(`:`)
- directives: `v-if`, `v-else-if`, `v-else`, `v-show`, `v-for`.
- events
3. **03 - Vue Pokemon**: using axios, TypeScript and Composition API to manage data in a Pokemon game. You have 4 options and need to guess the Pokemon name.
![image](https://github.com/user-attachments/assets/94cab2fb-fee5-40fa-91a2-6442ac126ea3)
![image](https://github.com/user-attachments/assets/d125da55-455b-4a56-b513-153ce98b88e9)
4. **04 - Vue.js course for Beginners with CDN** here you will find some Vue.js practice of FreeCodeCamp YouTube videos, learning: `v directives` (`v-model`, `v-show`, `v-if`, `v-else-if`, `v-else`, `v-for`), `v-cloak`, **events** (`@keyup.enter`), **components**, **lifecycle methods**.
5. **05 - Food App** from the same course [Vue.js Course for Beginners ](https://www.youtube.com/watch?v=FXpIoQ_rT_c&t=6s), part 2, creating a food app
7. **07 - Quiz app**: a little quiz app tp practice Vue.js, where I saw:
```
- components
- transition
- props
- methods
- emit
- lifecycle hook: mounted
```![image](https://github.com/user-attachments/assets/da67d00d-584a-484c-be1e-3e67fb5b6e82)
![image](https://github.com/user-attachments/assets/b575e65d-cfb4-4720-ac6e-3e719a8ed387)
![image](https://github.com/user-attachments/assets/2b79ec77-85cd-4009-9256-b412abb308ea)---
## TECHNOLOGIES:
- HTML5
- CSS3
- Bootstrap
- AnimateCSS
- JavaScript
- axios
- Pinia
- VUE.js
- Vue toaster
- Git
---
## Commands:
- Start a new project with Vite:
```bash
npm init vue@latest
```- Go to your new project folder:
```bash
cd
```- Install dependencies and run it locally at [http://localhost:5173/](http://localhost:5173/):
```bash
npm install
npm run dev
```---