├── README.md ├── lesson02 ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson03 ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson04 ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson05 ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson06 ├── demo.html ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson07 ├── demo.html ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson08 ├── end.html ├── example.html ├── example1.html ├── example2.html ├── favicon.ico ├── start.html └── style.css ├── lesson09 ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson10 ├── end.html ├── favicon.ico ├── start.html └── style.css ├── lesson11 ├── basic.html ├── favicon.ico ├── style.css └── tasks.html ├── lesson12 ├── favicon.ico ├── index.html └── style.css ├── lesson13 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson14 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson15 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson16 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson17 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson18 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson19 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson20 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson21 ├── app.js ├── favicon.ico ├── index.html └── style.css ├── lesson22 ├── .babelrc ├── .gitignore ├── README.md ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── assets │ │ └── logo.png │ └── main.js └── webpack.config.js ├── lesson23 ├── .babelrc ├── .gitignore ├── README.md ├── _task-app │ ├── app.js │ ├── favicon.ico │ ├── index.html │ └── style.css ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ └── main.js ├── style.css └── webpack.config.js ├── lesson24 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ └── main.js ├── style.css └── webpack.config.js ├── lesson25 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ └── main.js ├── style.css └── webpack.config.js ├── lesson26 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ └── main.js └── webpack.config.js ├── lesson27 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ └── main.js └── webpack.config.js ├── lesson28 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ └── main.js └── webpack.config.js ├── lesson29 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ ├── main.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson30 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ ├── main.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson31 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package.json ├── src │ ├── App.vue │ ├── Icon.vue │ ├── Task.vue │ ├── TaskForm.vue │ ├── TaskList.vue │ ├── assets │ │ └── logo.png │ ├── event-bus.js │ ├── main.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson32 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Icon.vue │ │ └── Task │ │ │ ├── CreateForm.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ ├── event-bus.js │ ├── main.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson33 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ └── Task │ │ │ ├── CreateForm.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ ├── event-bus.js │ ├── main.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson34 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ └── Task │ │ │ ├── CreateForm.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson35 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ └── Task │ │ │ ├── CreateForm.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ └── sass │ │ ├── _app.scss │ │ └── _variables.scss └── webpack.config.js ├── lesson36 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ └── Task │ │ │ ├── CreateForm.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson37 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── CreateForm.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson38 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── CreateForm.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson39 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── CreateForm.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson40 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── CreateForm.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ ├── ListItem.vue │ │ │ └── Tasks.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson41 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson42 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson43 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── Edit.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson44 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── Edit.vue │ │ │ ├── Form.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson45 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── Edit.vue │ │ │ ├── Form.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── event-bus.js │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ └── index.js └── webpack.config.js ├── lesson46 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── Edit.vue │ │ │ ├── Form.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ ├── index.js │ │ └── tasks.js └── webpack.config.js ├── lesson47 ├── .babelrc ├── .gitignore ├── README.md ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── App.vue │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── Counter.vue │ │ ├── Decrement.vue │ │ └── Increment.vue │ └── main.js └── webpack.config.js ├── lesson48 ├── .babelrc ├── .gitignore ├── README.md ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── App.vue │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── Counter.vue │ │ ├── Decrement.vue │ │ └── Increment.vue │ ├── main.js │ └── store │ │ └── index.js └── webpack.config.js ├── lesson49 ├── .babelrc ├── .gitignore ├── README.md ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── App.vue │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── Counter.vue │ │ ├── Decrement.vue │ │ └── Increment.vue │ ├── main.js │ └── store │ │ └── index.js └── webpack.config.js ├── lesson50 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src │ ├── assets │ │ └── logo.png │ ├── components │ │ ├── App.vue │ │ ├── Dashboard.vue │ │ ├── Icon.vue │ │ ├── Task │ │ │ ├── Create.vue │ │ │ ├── Details.vue │ │ │ ├── Edit.vue │ │ │ ├── Form.vue │ │ │ ├── List.vue │ │ │ └── ListItem.vue │ │ └── errors │ │ │ └── NotFound.vue │ ├── main.js │ ├── router │ │ └── index.js │ ├── sass │ │ ├── _app.scss │ │ └── _variables.scss │ └── store │ │ ├── index.js │ │ └── tasks.js └── webpack.config.js ├── lesson51 ├── favicon.ico └── index.html └── lesson52 ├── .babelrc ├── .gitignore ├── README.md ├── favicon.ico ├── index.html ├── package-lock.json ├── package.json ├── src ├── assets │ └── logo.png ├── components │ ├── App.vue │ ├── Dashboard.vue │ ├── Icon.vue │ ├── Task │ │ ├── Create.vue │ │ ├── Details.vue │ │ ├── Edit.vue │ │ ├── Form.vue │ │ ├── List.vue │ │ └── ListItem.vue │ └── errors │ │ └── NotFound.vue ├── main.js ├── router │ └── index.js ├── sass │ ├── _app.scss │ └── _variables.scss └── store │ ├── index.js │ └── tasks.js └── webpack.config.js /lesson02/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson02/favicon.ico -------------------------------------------------------------------------------- /lesson02/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin-top: 40px; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson03/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson03/favicon.ico -------------------------------------------------------------------------------- /lesson03/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin-top: 40px; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson04/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson04/favicon.ico -------------------------------------------------------------------------------- /lesson04/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin-top: 40px; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson05/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson05/favicon.ico -------------------------------------------------------------------------------- /lesson05/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin-top: 40px; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson06/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson06/favicon.ico -------------------------------------------------------------------------------- /lesson06/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin: 40px 0; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson07/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson07/favicon.ico -------------------------------------------------------------------------------- /lesson07/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin: 40px 0; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson08/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson08/favicon.ico -------------------------------------------------------------------------------- /lesson08/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin: 40px 0; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson09/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson09/favicon.ico -------------------------------------------------------------------------------- /lesson09/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin: 40px 0; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson10/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson10/favicon.ico -------------------------------------------------------------------------------- /lesson10/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin: 40px 0; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson11/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson11/favicon.ico -------------------------------------------------------------------------------- /lesson11/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 20px; 3 | } 4 | .container { 5 | max-width: 600px; 6 | } 7 | footer { 8 | margin: 40px 0; 9 | padding-top: 20px; 10 | border-top: 1px solid #ccc; 11 | color: #999; 12 | } -------------------------------------------------------------------------------- /lesson12/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson12/favicon.ico -------------------------------------------------------------------------------- /lesson12/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson13/app.js: -------------------------------------------------------------------------------- 1 | var vm = new Vue({ 2 | el: '#app', 3 | data: { 4 | tasks: [ 5 | { 6 | description: 'Aprender Vue.js', 7 | pending: true, 8 | editing: false 9 | }, 10 | { 11 | description: 'Suscribirse a Styde.net', 12 | pending: true, 13 | editing: true 14 | }, 15 | { 16 | description: 'Grabar lección de Vue', 17 | pending: false, 18 | editing: false 19 | } 20 | ] 21 | } 22 | }); -------------------------------------------------------------------------------- /lesson13/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson13/favicon.ico -------------------------------------------------------------------------------- /lesson13/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson14/app.js: -------------------------------------------------------------------------------- 1 | var vm = new Vue({ 2 | el: '#app', 3 | methods: { 4 | createTask: function () { 5 | this.tasks.push({ 6 | description: this.new_task, 7 | pending: true, 8 | editing: false 9 | }); 10 | 11 | this.new_task = ''; 12 | } 13 | }, 14 | data: { 15 | new_task: '', 16 | tasks: [ 17 | { 18 | description: 'Aprender Vue.js', 19 | pending: true, 20 | editing: false 21 | }, 22 | { 23 | description: 'Suscribirse a Styde.net', 24 | pending: true, 25 | editing: true 26 | }, 27 | { 28 | description: 'Grabar lección de Vue', 29 | pending: false, 30 | editing: false 31 | } 32 | ] 33 | } 34 | }); -------------------------------------------------------------------------------- /lesson14/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson14/favicon.ico -------------------------------------------------------------------------------- /lesson14/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson15/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson15/favicon.ico -------------------------------------------------------------------------------- /lesson15/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson16/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson16/favicon.ico -------------------------------------------------------------------------------- /lesson16/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson17/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson17/favicon.ico -------------------------------------------------------------------------------- /lesson17/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson18/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson18/favicon.ico -------------------------------------------------------------------------------- /lesson18/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson19/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson19/favicon.ico -------------------------------------------------------------------------------- /lesson19/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson20/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson20/favicon.ico -------------------------------------------------------------------------------- /lesson20/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson21/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson21/favicon.ico -------------------------------------------------------------------------------- /lesson21/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson22/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson22/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson22/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson22/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /lesson22/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson22/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson22/src/assets/logo.png -------------------------------------------------------------------------------- /lesson22/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson23/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson23/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson23/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson23/_task-app/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson23/_task-app/favicon.ico -------------------------------------------------------------------------------- /lesson23/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 9 | 10 | 11 | 12 | 13 |
14 | 15 |
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /lesson23/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson23/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson23/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson23/src/assets/logo.png -------------------------------------------------------------------------------- /lesson23/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson23/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson23/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson24/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson24/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson24/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson24/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson24/favicon.ico -------------------------------------------------------------------------------- /lesson24/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 9 | 10 | 11 | 12 | 13 |
14 | 15 |
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /lesson24/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson24/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson24/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson24/src/assets/logo.png -------------------------------------------------------------------------------- /lesson24/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson24/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson24/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson25/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson25/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson25/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson25/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson25/favicon.ico -------------------------------------------------------------------------------- /lesson25/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 9 | 10 | 11 | 12 | 13 |
14 | 15 |
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /lesson25/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson25/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson25/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | -------------------------------------------------------------------------------- /lesson25/src/TaskList.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | -------------------------------------------------------------------------------- /lesson25/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson25/src/assets/logo.png -------------------------------------------------------------------------------- /lesson25/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson25/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson25/style.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 10px; 3 | } 4 | 5 | .container { 6 | max-width: 650px; 7 | } 8 | 9 | .container h2 { 10 | margin-bottom: 20px; 11 | } 12 | 13 | .tasks { 14 | margin-bottom: 40px; 15 | } 16 | 17 | .tasks a { 18 | text-decoration: none; 19 | } 20 | 21 | .tasks li { 22 | display: flex; 23 | justify-content: space-between; 24 | } 25 | 26 | .tasks li.editing { 27 | box-shadow: inset 0 0 5px #999; 28 | } 29 | 30 | .tasks input, .tasks .description { 31 | flex: 1; 32 | padding: 0 5px; 33 | } 34 | 35 | .tasks input { 36 | border: 0; 37 | } 38 | 39 | .tasks input:focus { 40 | outline: none; 41 | } 42 | 43 | .completed .description { 44 | text-decoration: line-through; 45 | } 46 | 47 | .completed, .completed a { 48 | color: #999; 49 | } 50 | 51 | .new-task-form { 52 | display: flex; 53 | } 54 | 55 | .new-task-form input { 56 | margin-right: 10px; 57 | } 58 | 59 | .container footer { 60 | margin: 40px 0; 61 | padding-top: 20px; 62 | border-top: 1px solid #ccc; 63 | color: #999; 64 | } -------------------------------------------------------------------------------- /lesson26/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson26/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson26/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson26/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson26/favicon.ico -------------------------------------------------------------------------------- /lesson26/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 | 9 | 10 |
11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /lesson26/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=development webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson26/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson26/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 28 | 29 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | -------------------------------------------------------------------------------- /lesson26/src/TaskList.vue: -------------------------------------------------------------------------------- 1 | 7 | 8 | 23 | 24 | 29 | 30 | 31 | 32 | 33 | 34 | -------------------------------------------------------------------------------- /lesson26/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson26/src/assets/logo.png -------------------------------------------------------------------------------- /lesson26/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson26/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson27/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson27/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson27/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson27/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson27/favicon.ico -------------------------------------------------------------------------------- /lesson27/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 | 9 | 10 |
11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /lesson27/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=development webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson27/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson27/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson27/src/TaskList.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 28 | 29 | 35 | 36 | 41 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /lesson27/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson27/src/assets/logo.png -------------------------------------------------------------------------------- /lesson27/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson27/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson28/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson28/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson28/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson28/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson28/favicon.ico -------------------------------------------------------------------------------- /lesson28/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 | 9 | 10 |
11 | 12 |
13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /lesson28/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=development webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.2.1" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.0.0", 16 | "babel-loader": "^6.0.0", 17 | "babel-preset-latest": "^6.0.0", 18 | "cross-env": "^3.0.0", 19 | "css-loader": "^0.25.0", 20 | "file-loader": "^0.9.0", 21 | "node-sass": "^4.5.0", 22 | "sass-loader": "^5.0.1", 23 | "vue-loader": "^11.1.4", 24 | "vue-template-compiler": "^2.2.1", 25 | "webpack": "^2.2.0", 26 | "webpack-dev-server": "^2.2.0" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson28/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson28/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson28/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson28/src/assets/logo.png -------------------------------------------------------------------------------- /lesson28/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson28/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson29/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson29/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson29/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson29/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson29/favicon.ico -------------------------------------------------------------------------------- /lesson29/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | -------------------------------------------------------------------------------- /lesson29/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=development webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "bootstrap-sass": "^3.3.7", 13 | "vue": "^2.2.1" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.0.0", 17 | "babel-loader": "^6.0.0", 18 | "babel-preset-latest": "^6.0.0", 19 | "cross-env": "^3.0.0", 20 | "css-loader": "^0.25.0", 21 | "file-loader": "^0.9.0", 22 | "node-sass": "^4.5.0", 23 | "sass-loader": "^5.0.1", 24 | "vue-loader": "^11.1.4", 25 | "vue-template-compiler": "^2.2.1", 26 | "webpack": "^2.2.0", 27 | "webpack-dev-server": "^2.2.0" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /lesson29/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson29/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson29/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson29/src/assets/logo.png -------------------------------------------------------------------------------- /lesson29/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson29/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson29/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | @import "./variables"; 2 | 3 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson29/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson30/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson30/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson30/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson30/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson30/favicon.ico -------------------------------------------------------------------------------- /lesson30/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson30/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "bootstrap-sass": "^3.3.7", 13 | "vue": "^2.2.1" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.0.0", 17 | "babel-loader": "^6.0.0", 18 | "babel-preset-latest": "^6.0.0", 19 | "cross-env": "^3.0.0", 20 | "css-loader": "^0.25.0", 21 | "extract-text-webpack-plugin": "^2.1.0", 22 | "file-loader": "^0.9.0", 23 | "node-sass": "^4.5.0", 24 | "sass-loader": "^5.0.1", 25 | "vue-loader": "^11.1.4", 26 | "vue-template-compiler": "^2.2.1", 27 | "webpack": "^2.2.0", 28 | "webpack-dev-server": "^2.2.0" 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /lesson30/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson30/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson30/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson30/src/assets/logo.png -------------------------------------------------------------------------------- /lesson30/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson30/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson30/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | @import "./variables"; 2 | 3 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson30/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson31/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson31/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson31/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson31/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson31/favicon.ico -------------------------------------------------------------------------------- /lesson31/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson31/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "bootstrap-sass": "^3.3.7", 13 | "vue": "^2.2.1" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.0.0", 17 | "babel-loader": "^6.0.0", 18 | "babel-preset-latest": "^6.0.0", 19 | "cross-env": "^3.0.0", 20 | "css-loader": "^0.25.0", 21 | "extract-text-webpack-plugin": "^2.1.0", 22 | "file-loader": "^0.9.0", 23 | "node-sass": "^4.5.0", 24 | "purify-css": "^1.2.2", 25 | "purifycss-webpack": "^0.7.0", 26 | "sass-loader": "^5.0.1", 27 | "vue-loader": "^11.1.4", 28 | "vue-template-compiler": "^2.2.1", 29 | "webpack": "^2.2.0", 30 | "webpack-dev-server": "^2.2.0" 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /lesson31/src/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson31/src/TaskForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson31/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson31/src/assets/logo.png -------------------------------------------------------------------------------- /lesson31/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson31/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | var vm = new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson31/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | @import "./variables"; 2 | 3 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson31/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson32/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson32/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson32/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson32/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson32/favicon.ico -------------------------------------------------------------------------------- /lesson32/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson32/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "curso-vue-styde", 3 | "description": "Aplicacion para el curso de Vue 2 de styde.net", 4 | "version": "1.0.0", 5 | "author": "Duilio ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "bootstrap-sass": "^3.3.7", 13 | "vue": "^2.2.1" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.0.0", 17 | "babel-loader": "^6.0.0", 18 | "babel-preset-latest": "^6.0.0", 19 | "cross-env": "^3.0.0", 20 | "css-loader": "^0.25.0", 21 | "extract-text-webpack-plugin": "^2.1.0", 22 | "file-loader": "^0.9.0", 23 | "node-sass": "^4.5.0", 24 | "purify-css": "^1.2.2", 25 | "purifycss-webpack": "^0.7.0", 26 | "sass-loader": "^5.0.1", 27 | "vue-loader": "^11.1.4", 28 | "vue-template-compiler": "^2.2.1", 29 | "webpack": "^2.2.0", 30 | "webpack-dev-server": "^2.2.0" 31 | } 32 | } 33 | -------------------------------------------------------------------------------- /lesson32/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson32/src/assets/logo.png -------------------------------------------------------------------------------- /lesson32/src/components/App.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 22 | 23 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | -------------------------------------------------------------------------------- /lesson32/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson32/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson32/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson32/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson32/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import EventBus from 'event-bus.js' 3 | import App from './components/App.vue' 4 | 5 | window.EventBus = EventBus 6 | 7 | var vm = new Vue({ 8 | el: '#app', 9 | render: h => h(App) 10 | }) 11 | -------------------------------------------------------------------------------- /lesson32/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson32/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson33/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson33/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson33/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson33/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson33/favicon.ico -------------------------------------------------------------------------------- /lesson33/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson33/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson33/src/assets/logo.png -------------------------------------------------------------------------------- /lesson33/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson33/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson33/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson33/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson33/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson33/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | import Dashboard from './components/Dashboard.vue' 6 | import Tasks from './components/Task/Tasks.vue' 7 | 8 | Vue.use(Router) 9 | 10 | const router = new Router({ 11 | routes: [ 12 | { 13 | path: '/', 14 | component: Dashboard 15 | }, 16 | { 17 | path: '/tasks', 18 | component: Tasks 19 | } 20 | ] 21 | }); 22 | 23 | window.EventBus = EventBus 24 | 25 | var vm = new Vue({ 26 | el: '#app', 27 | router, 28 | render: h => h(App) 29 | }) 30 | -------------------------------------------------------------------------------- /lesson33/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson33/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson34/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson34/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson34/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson34/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson34/favicon.ico -------------------------------------------------------------------------------- /lesson34/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson34/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson34/src/assets/logo.png -------------------------------------------------------------------------------- /lesson34/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson34/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson34/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson34/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson34/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson34/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | var vm = new Vue({ 9 | el: '#app', 10 | router, 11 | render: h => h(App) 12 | }) 13 | -------------------------------------------------------------------------------- /lesson34/src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import Tasks from 'components/Task/Tasks.vue' 4 | import Dashboard from 'components/Dashboard.vue' 5 | 6 | Vue.use(Router) 7 | 8 | const router = new Router({ 9 | routes: [ 10 | { 11 | path: '/', 12 | component: Dashboard 13 | }, 14 | { 15 | path: '/tasks', 16 | component: Tasks 17 | } 18 | ] 19 | }); 20 | 21 | export default router -------------------------------------------------------------------------------- /lesson34/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson34/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson35/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson35/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson35/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson35/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson35/favicon.ico -------------------------------------------------------------------------------- /lesson35/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson35/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson35/src/assets/logo.png -------------------------------------------------------------------------------- /lesson35/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson35/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson35/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson35/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson35/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson35/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson35/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | var vm = new Vue({ 9 | el: '#app', 10 | router, 11 | render: h => h(App) 12 | }) 13 | -------------------------------------------------------------------------------- /lesson35/src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import Tasks from 'components/Task/Tasks.vue' 4 | import Dashboard from 'components/Dashboard.vue' 5 | import TaskDetails from 'components/Task/Details.vue' 6 | 7 | Vue.use(Router) 8 | 9 | const router = new Router({ 10 | routes: [ 11 | { 12 | path: '/', 13 | component: Dashboard 14 | }, 15 | { 16 | path: '/tasks', 17 | component: Tasks 18 | }, 19 | { 20 | path: '/tasks/:id', 21 | component: TaskDetails, 22 | props: true 23 | } 24 | ] 25 | }); 26 | 27 | export default router -------------------------------------------------------------------------------- /lesson35/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson35/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson36/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson36/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson36/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson36/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson36/favicon.ico -------------------------------------------------------------------------------- /lesson36/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson36/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson36/src/assets/logo.png -------------------------------------------------------------------------------- /lesson36/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson36/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson36/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson36/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson36/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson36/src/components/Task/Tasks.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | -------------------------------------------------------------------------------- /lesson36/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson36/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | var vm = new Vue({ 9 | el: '#app', 10 | router, 11 | render: h => h(App) 12 | }) 13 | -------------------------------------------------------------------------------- /lesson36/src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import Tasks from 'components/Task/Tasks.vue' 4 | import Dashboard from 'components/Dashboard.vue' 5 | import TaskDetails from 'components/Task/Details.vue' 6 | 7 | Vue.use(Router) 8 | 9 | const router = new Router({ 10 | routes: [ 11 | { 12 | path: '/', 13 | component: Dashboard 14 | }, 15 | { 16 | path: '/tasks', 17 | component: Tasks 18 | }, 19 | { 20 | path: '/tasks/:id', 21 | component: TaskDetails, 22 | props: true 23 | } 24 | ] 25 | }); 26 | 27 | export default router -------------------------------------------------------------------------------- /lesson36/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson36/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson36/src/store/index.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default { 27 | state: { 28 | tasks 29 | }, 30 | findTask(id) { 31 | return this.state.tasks.find(task => task.id == id) 32 | } 33 | }; -------------------------------------------------------------------------------- /lesson37/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson37/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson37/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson37/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson37/favicon.ico -------------------------------------------------------------------------------- /lesson37/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson37/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson37/src/assets/logo.png -------------------------------------------------------------------------------- /lesson37/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson37/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson37/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson37/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson37/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson37/src/components/Task/Tasks.vue: -------------------------------------------------------------------------------- 1 | 10 | 11 | -------------------------------------------------------------------------------- /lesson37/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson37/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson37/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | var vm = new Vue({ 21 | el: '#app', 22 | router, 23 | render: h => h(App) 24 | }) 25 | -------------------------------------------------------------------------------- /lesson37/src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import Tasks from 'components/Task/Tasks.vue' 4 | import Dashboard from 'components/Dashboard.vue' 5 | import TaskDetails from 'components/Task/Details.vue' 6 | import ErrorNotFound from 'components/errors/NotFound.vue' 7 | 8 | Vue.use(Router) 9 | 10 | const router = new Router({ 11 | routes: [ 12 | { 13 | path: '/', 14 | component: Dashboard 15 | }, 16 | { 17 | path: '/tasks', 18 | component: Tasks 19 | }, 20 | { 21 | path: '/tasks/:id', 22 | component: TaskDetails, 23 | props: true 24 | }, 25 | { 26 | path: '/404', 27 | component: ErrorNotFound 28 | }, 29 | { 30 | path: '*', 31 | redirect: '/404' 32 | } 33 | ] 34 | }); 35 | 36 | export default router 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson37/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson37/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson37/src/store/index.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default { 27 | state: { 28 | tasks 29 | }, 30 | findTask(id) { 31 | return this.state.tasks.find(task => task.id == id) 32 | } 33 | }; -------------------------------------------------------------------------------- /lesson38/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson38/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson38/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson38/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson38/favicon.ico -------------------------------------------------------------------------------- /lesson38/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson38/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson38/src/assets/logo.png -------------------------------------------------------------------------------- /lesson38/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson38/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson38/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson38/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson38/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson38/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson38/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson38/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | var vm = new Vue({ 21 | el: '#app', 22 | router, 23 | render: h => h(App) 24 | }) 25 | -------------------------------------------------------------------------------- /lesson38/src/router/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Router from 'vue-router' 3 | import Tasks from 'components/Task/Tasks.vue' 4 | import Dashboard from 'components/Dashboard.vue' 5 | import TaskDetails from 'components/Task/Details.vue' 6 | import ErrorNotFound from 'components/errors/NotFound.vue' 7 | 8 | Vue.use(Router) 9 | 10 | const router = new Router({ 11 | routes: [ 12 | { 13 | path: '/', 14 | component: Dashboard 15 | }, 16 | { 17 | path: '/tasks', 18 | component: Tasks, 19 | children: [ 20 | { 21 | path: '', 22 | component: { 23 | template: '

Por favor selecciona una tarea

' 24 | } 25 | }, 26 | { 27 | path: ':id', 28 | component: TaskDetails, 29 | props: true 30 | } 31 | ] 32 | }, 33 | { 34 | path: '/404', 35 | component: ErrorNotFound 36 | }, 37 | { 38 | path: '*', 39 | redirect: '/404' 40 | } 41 | ] 42 | }); 43 | 44 | export default router 45 | 46 | 47 | 48 | 49 | 50 | 51 | -------------------------------------------------------------------------------- /lesson38/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson38/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson38/src/store/index.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default { 27 | state: { 28 | tasks 29 | }, 30 | findTask(id) { 31 | return this.state.tasks.find(task => task.id == id) 32 | } 33 | }; -------------------------------------------------------------------------------- /lesson39/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson39/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson39/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson39/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson39/favicon.ico -------------------------------------------------------------------------------- /lesson39/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson39/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson39/src/assets/logo.png -------------------------------------------------------------------------------- /lesson39/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson39/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson39/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson39/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson39/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson39/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson39/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson39/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | var vm = new Vue({ 21 | el: '#app', 22 | router, 23 | render: h => h(App) 24 | }) 25 | -------------------------------------------------------------------------------- /lesson39/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson39/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson39/src/store/index.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default { 27 | state: { 28 | tasks 29 | }, 30 | findTask(id) { 31 | return this.state.tasks.find(task => task.id == id) 32 | } 33 | }; -------------------------------------------------------------------------------- /lesson40/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson40/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson40/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson40/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson40/favicon.ico -------------------------------------------------------------------------------- /lesson40/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson40/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson40/src/assets/logo.png -------------------------------------------------------------------------------- /lesson40/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson40/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson40/src/components/Task/CreateForm.vue: -------------------------------------------------------------------------------- 1 | 11 | 12 | 32 | 33 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | 52 | 53 | -------------------------------------------------------------------------------- /lesson40/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson40/src/components/Task/List.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 33 | 34 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson40/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson40/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson40/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | var vm = new Vue({ 21 | el: '#app', 22 | router, 23 | render: h => h(App) 24 | }) 25 | -------------------------------------------------------------------------------- /lesson40/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson40/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson40/src/store/index.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default { 27 | state: { 28 | tasks 29 | }, 30 | findTask(id) { 31 | return this.state.tasks.find(task => task.id == id) 32 | } 33 | }; -------------------------------------------------------------------------------- /lesson41/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson41/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson41/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson41/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson41/favicon.ico -------------------------------------------------------------------------------- /lesson41/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson41/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson41/src/assets/logo.png -------------------------------------------------------------------------------- /lesson41/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson41/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson41/src/components/Task/Details.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | -------------------------------------------------------------------------------- /lesson41/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson41/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson41/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | var vm = new Vue({ 21 | el: '#app', 22 | router, 23 | render: h => h(App) 24 | }) 25 | -------------------------------------------------------------------------------- /lesson41/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson41/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson41/src/store/index.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default { 27 | state: { 28 | tasks 29 | }, 30 | findTask(id) { 31 | return this.state.tasks.find(task => task.id == id) 32 | }, 33 | createTask(task) { 34 | task.id = this.state.tasks.length + 1; 35 | 36 | this.state.tasks.push(task); 37 | } 38 | }; 39 | 40 | 41 | 42 | -------------------------------------------------------------------------------- /lesson42/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson42/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson42/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson42/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson42/favicon.ico -------------------------------------------------------------------------------- /lesson42/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson42/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson42/src/assets/logo.png -------------------------------------------------------------------------------- /lesson42/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson42/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson42/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson42/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson42/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | Vue.component('app-icon', require('./components/Icon.vue')); 21 | 22 | var vm = new Vue({ 23 | el: '#app', 24 | router, 25 | render: h => h(App) 26 | }) 27 | -------------------------------------------------------------------------------- /lesson42/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson42/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson43/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson43/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson43/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson43/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson43/favicon.ico -------------------------------------------------------------------------------- /lesson43/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson43/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson43/src/assets/logo.png -------------------------------------------------------------------------------- /lesson43/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson43/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson43/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson43/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson43/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | window.clone = function (obj) { 21 | return JSON.parse(JSON.stringify(obj)); 22 | } 23 | 24 | Vue.component('app-icon', require('./components/Icon.vue')); 25 | 26 | var vm = new Vue({ 27 | el: '#app', 28 | router, 29 | render: h => h(App) 30 | }) 31 | -------------------------------------------------------------------------------- /lesson43/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson43/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson44/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson44/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson44/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson44/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson44/favicon.ico -------------------------------------------------------------------------------- /lesson44/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson44/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson44/src/assets/logo.png -------------------------------------------------------------------------------- /lesson44/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson44/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson44/src/components/Task/Create.vue: -------------------------------------------------------------------------------- 1 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /lesson44/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson44/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson44/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | window.clone = function (obj) { 21 | return JSON.parse(JSON.stringify(obj)); 22 | } 23 | 24 | Vue.component('app-icon', require('./components/Icon.vue')); 25 | 26 | var vm = new Vue({ 27 | el: '#app', 28 | router, 29 | render: h => h(App) 30 | }) 31 | -------------------------------------------------------------------------------- /lesson44/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson44/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson45/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson45/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson45/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson45/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson45/favicon.ico -------------------------------------------------------------------------------- /lesson45/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson45/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson45/src/assets/logo.png -------------------------------------------------------------------------------- /lesson45/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson45/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson45/src/components/Task/Create.vue: -------------------------------------------------------------------------------- 1 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /lesson45/src/components/Task/Edit.vue: -------------------------------------------------------------------------------- 1 | 52 | 53 | 54 | 55 | 56 | 57 | -------------------------------------------------------------------------------- /lesson45/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson45/src/event-bus.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | 3 | export default new Vue; -------------------------------------------------------------------------------- /lesson45/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import EventBus from 'event-bus.js' 4 | import App from './components/App.vue' 5 | 6 | window.EventBus = EventBus 7 | 8 | window.not_found = function () { 9 | console.log('Not found:' + router.currentRoute.fullPath); 10 | 11 | router.replace('/404'); 12 | }; 13 | 14 | window.not_found_unless = function (condition) { 15 | if (! condition) { 16 | not_found(); 17 | } 18 | } 19 | 20 | window.clone = function (obj) { 21 | return JSON.parse(JSON.stringify(obj)); 22 | } 23 | 24 | Vue.component('app-icon', require('./components/Icon.vue')); 25 | 26 | var vm = new Vue({ 27 | el: '#app', 28 | router, 29 | render: h => h(App) 30 | }) 31 | -------------------------------------------------------------------------------- /lesson45/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson45/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson46/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson46/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson46/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson46/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson46/favicon.ico -------------------------------------------------------------------------------- /lesson46/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson46/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson46/src/assets/logo.png -------------------------------------------------------------------------------- /lesson46/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson46/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson46/src/components/Task/Create.vue: -------------------------------------------------------------------------------- 1 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /lesson46/src/components/Task/Edit.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /lesson46/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson46/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import App from './components/App.vue' 4 | 5 | window.not_found = function () { 6 | console.log('Not found:' + router.currentRoute.fullPath); 7 | 8 | router.replace('/404'); 9 | }; 10 | 11 | window.not_found_unless = function (condition) { 12 | if (! condition) { 13 | not_found(); 14 | } 15 | } 16 | 17 | window.clone = function (obj) { 18 | return JSON.parse(JSON.stringify(obj)); 19 | } 20 | 21 | Vue.component('app-icon', require('./components/Icon.vue')); 22 | 23 | var vm = new Vue({ 24 | el: '#app', 25 | router, 26 | render: h => h(App) 27 | }) 28 | -------------------------------------------------------------------------------- /lesson46/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson46/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson46/src/store/tasks.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default tasks; -------------------------------------------------------------------------------- /lesson47/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { "modules": false }] 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /lesson47/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | 7 | # Editor directories and files 8 | .idea 9 | *.suo 10 | *.ntvs* 11 | *.njsproj 12 | *.sln 13 | -------------------------------------------------------------------------------- /lesson47/README.md: -------------------------------------------------------------------------------- 1 | # vuex-counter 2 | 3 | > A simple counter with Vuex 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson47/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | vuex-counter 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /lesson47/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vuex-counter", 3 | "description": "A simple counter with Vuex", 4 | "version": "1.0.0", 5 | "author": "Duilio Palacios ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.4.4" 13 | }, 14 | "devDependencies": { 15 | "babel-core": "^6.26.0", 16 | "babel-loader": "^7.1.2", 17 | "babel-preset-env": "^1.6.0", 18 | "cross-env": "^5.0.5", 19 | "css-loader": "^0.28.7", 20 | "file-loader": "^1.1.4", 21 | "vue-loader": "^13.0.5", 22 | "vue-template-compiler": "^2.4.4", 23 | "webpack": "^3.6.0", 24 | "webpack-dev-server": "^2.9.1" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /lesson47/src/App.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 25 | 26 | -------------------------------------------------------------------------------- /lesson47/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson47/src/assets/logo.png -------------------------------------------------------------------------------- /lesson47/src/components/Counter.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson47/src/components/Decrement.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson47/src/components/Increment.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson47/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson48/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { "modules": false }] 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /lesson48/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | 7 | # Editor directories and files 8 | .idea 9 | *.suo 10 | *.ntvs* 11 | *.njsproj 12 | *.sln 13 | -------------------------------------------------------------------------------- /lesson48/README.md: -------------------------------------------------------------------------------- 1 | # vuex-counter 2 | 3 | > A simple counter with Vuex 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson48/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | vuex-counter 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /lesson48/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vuex-counter", 3 | "description": "A simple counter with Vuex", 4 | "version": "1.0.0", 5 | "author": "Duilio Palacios ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.4.4", 13 | "vuex": "^2.4.1" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.26.0", 17 | "babel-loader": "^7.1.2", 18 | "babel-preset-env": "^1.6.0", 19 | "cross-env": "^5.0.5", 20 | "css-loader": "^0.28.7", 21 | "file-loader": "^1.1.4", 22 | "vue-loader": "^13.0.5", 23 | "vue-template-compiler": "^2.4.4", 24 | "webpack": "^3.6.0", 25 | "webpack-dev-server": "^2.9.1" 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /lesson48/src/App.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 31 | 32 | -------------------------------------------------------------------------------- /lesson48/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson48/src/assets/logo.png -------------------------------------------------------------------------------- /lesson48/src/components/Counter.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson48/src/components/Decrement.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson48/src/components/Increment.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson48/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | 4 | new Vue({ 5 | el: '#app', 6 | render: h => h(App) 7 | }) 8 | -------------------------------------------------------------------------------- /lesson48/src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | Vue.use(Vuex) 5 | 6 | let store = new Vuex.Store({ 7 | state: { 8 | count: 0 9 | }, 10 | mutations: { 11 | increment(state) { 12 | state.count++ 13 | }, 14 | decrement(state) { 15 | state.count-- 16 | } 17 | } 18 | }) 19 | 20 | export default store -------------------------------------------------------------------------------- /lesson49/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["env", { "modules": false }] 4 | ], 5 | "plugins": ["transform-object-rest-spread"] 6 | } 7 | -------------------------------------------------------------------------------- /lesson49/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | 7 | # Editor directories and files 8 | .idea 9 | *.suo 10 | *.ntvs* 11 | *.njsproj 12 | *.sln 13 | -------------------------------------------------------------------------------- /lesson49/README.md: -------------------------------------------------------------------------------- 1 | # vuex-counter 2 | 3 | > A simple counter with Vuex 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson49/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | vuex-counter 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /lesson49/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vuex-counter", 3 | "description": "A simple counter with Vuex", 4 | "version": "1.0.0", 5 | "author": "Duilio Palacios ", 6 | "private": true, 7 | "scripts": { 8 | "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot", 9 | "build": "cross-env NODE_ENV=production webpack --progress --hide-modules" 10 | }, 11 | "dependencies": { 12 | "vue": "^2.4.4", 13 | "vuex": "^2.4.1" 14 | }, 15 | "devDependencies": { 16 | "babel-core": "^6.26.0", 17 | "babel-loader": "^7.1.2", 18 | "babel-plugin-transform-object-rest-spread": "^6.26.0", 19 | "babel-preset-env": "^1.6.0", 20 | "cross-env": "^5.0.5", 21 | "css-loader": "^0.28.7", 22 | "file-loader": "^1.1.4", 23 | "vue-loader": "^13.0.5", 24 | "vue-template-compiler": "^2.4.4", 25 | "webpack": "^3.6.0", 26 | "webpack-dev-server": "^2.9.1" 27 | } 28 | } 29 | -------------------------------------------------------------------------------- /lesson49/src/App.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 31 | 32 | -------------------------------------------------------------------------------- /lesson49/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson49/src/assets/logo.png -------------------------------------------------------------------------------- /lesson49/src/components/Counter.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson49/src/components/Decrement.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson49/src/components/Increment.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson49/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import App from './App.vue' 3 | import store from './store' 4 | 5 | new Vue({ 6 | el: '#app', 7 | render: h => h(App), 8 | store 9 | }) 10 | -------------------------------------------------------------------------------- /lesson49/src/store/index.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Vuex from 'vuex' 3 | 4 | Vue.use(Vuex) 5 | 6 | let store = new Vuex.Store({ 7 | state: { 8 | count: 0 9 | }, 10 | getters: { 11 | tripleCounter: (state) => state.count * 3 12 | }, 13 | mutations: { 14 | increment(state) { 15 | state.count++ 16 | }, 17 | decrement(state) { 18 | state.count-- 19 | } 20 | } 21 | }) 22 | 23 | export default store -------------------------------------------------------------------------------- /lesson50/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson50/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson50/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson50/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson50/favicon.ico -------------------------------------------------------------------------------- /lesson50/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson50/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson50/src/assets/logo.png -------------------------------------------------------------------------------- /lesson50/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson50/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson50/src/components/Task/Create.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | -------------------------------------------------------------------------------- /lesson50/src/components/Task/Edit.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /lesson50/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson50/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import App from './components/App.vue' 4 | 5 | window.not_found = function () { 6 | console.log('Not found:' + router.currentRoute.fullPath); 7 | 8 | router.replace('/404'); 9 | }; 10 | 11 | window.not_found_unless = function (condition) { 12 | if (! condition) { 13 | not_found(); 14 | } 15 | } 16 | 17 | window.clone = function (obj) { 18 | return JSON.parse(JSON.stringify(obj)); 19 | } 20 | 21 | Vue.component('app-icon', require('./components/Icon.vue')); 22 | 23 | var vm = new Vue({ 24 | el: '#app', 25 | router, 26 | render: h => h(App) 27 | }) 28 | -------------------------------------------------------------------------------- /lesson50/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson50/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson50/src/store/tasks.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default tasks; -------------------------------------------------------------------------------- /lesson51/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson51/favicon.ico -------------------------------------------------------------------------------- /lesson51/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | JS demo 6 | 7 | 8 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 | 51 | -------------------------------------------------------------------------------- /lesson52/.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": [ 3 | ["latest", { 4 | "es2015": { "modules": false } 5 | }] 6 | ] 7 | } 8 | -------------------------------------------------------------------------------- /lesson52/.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules/ 3 | dist/ 4 | npm-debug.log 5 | yarn-error.log 6 | -------------------------------------------------------------------------------- /lesson52/README.md: -------------------------------------------------------------------------------- 1 | # curso-vue-styde 2 | 3 | > Aplicacion para el curso de Vue 2 de styde.net 4 | 5 | ## Build Setup 6 | 7 | ``` bash 8 | # install dependencies 9 | npm install 10 | 11 | # serve with hot reload at localhost:8080 12 | npm run dev 13 | 14 | # build for production with minification 15 | npm run build 16 | ``` 17 | 18 | For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader). 19 | -------------------------------------------------------------------------------- /lesson52/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson52/favicon.ico -------------------------------------------------------------------------------- /lesson52/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | curso-vue-styde 6 | 7 | 8 |
9 | 10 |
11 | 12 | 13 | 14 | 15 | -------------------------------------------------------------------------------- /lesson52/src/assets/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/StydeNet/vue2/c49fcc3a2ecc274cb2255f099137069c39fd3f25/lesson52/src/assets/logo.png -------------------------------------------------------------------------------- /lesson52/src/components/Dashboard.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | -------------------------------------------------------------------------------- /lesson52/src/components/Icon.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | -------------------------------------------------------------------------------- /lesson52/src/components/Task/Edit.vue: -------------------------------------------------------------------------------- 1 | 33 | 34 | 35 | 36 | 37 | 38 | -------------------------------------------------------------------------------- /lesson52/src/components/errors/NotFound.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | -------------------------------------------------------------------------------- /lesson52/src/main.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import router from 'router' 3 | import App from './components/App.vue' 4 | 5 | window.not_found = function () { 6 | console.log('Not found:' + router.currentRoute.fullPath); 7 | 8 | router.replace('/404'); 9 | }; 10 | 11 | window.not_found_unless = function (condition) { 12 | if (! condition) { 13 | not_found(); 14 | } 15 | } 16 | 17 | window.clone = function (obj) { 18 | return JSON.parse(JSON.stringify(obj)); 19 | } 20 | 21 | Vue.component('app-icon', require('./components/Icon.vue')); 22 | 23 | var vm = new Vue({ 24 | el: '#app', 25 | router, 26 | render: h => h(App) 27 | }) 28 | -------------------------------------------------------------------------------- /lesson52/src/sass/_app.scss: -------------------------------------------------------------------------------- 1 | 2 | @import "./variables"; 3 | 4 | @import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap"; -------------------------------------------------------------------------------- /lesson52/src/sass/_variables.scss: -------------------------------------------------------------------------------- 1 | $icon-font-path: "~bootstrap-sass/assets/fonts/bootstrap/"; 2 | 3 | $error-color: red; -------------------------------------------------------------------------------- /lesson52/src/store/tasks.js: -------------------------------------------------------------------------------- 1 | let tasks = [ 2 | { 3 | title: 'Aprender Vue.js', 4 | pending: true, 5 | }, 6 | { 7 | title: 'Suscribirse a Styde.net', 8 | pending: true, 9 | }, 10 | { 11 | title: 'Grabar lección de Vue', 12 | pending: false, 13 | } 14 | ]; 15 | 16 | tasks.forEach((task, index) => { 17 | task.description = ` 18 | Lorem ipsum dolor sit amet, consectetur adipiscing elit. 19 | Maecenas sed nunc recomienda Styde in diam pulvinar pellentesque. 20 | Maecenas sagittis quam ac orci feugiat hendrerit ac ac mauris. 21 | `; 22 | 23 | task.id = index + 1; 24 | }); 25 | 26 | export default tasks; --------------------------------------------------------------------------------