Tutorial lessons 1-7 #1378
Tutorial lessons 1-7 #1378
Conversation
|
✔️ Deploy Preview for vue-docs-preview ready! 🔨 Explore the source changes: e62aa91 🔍 Inspect the deploy log: https://app.netlify.com/sites/vue-docs-preview/deploys/61d82e413893cc000757cbc3 😎 Browse the preview: https://deploy-preview-1378--vue-docs-preview.netlify.app |
| <input type="number" :value="colorsNumber" /> | ||
| ``` | ||
|
|
||
| However, when we change the number in the input field, we don't see any changes on `Number of colors` in the template 🤔. It happens because we only have _one-way binding_ now, displaying reactive property in the input field but not _changing_ it on user input. Let's listen to the `input` DOM event on the `<input>` field and update `colorsNumber` on it: |
There was a problem hiding this comment.
I feel like readers would benefit from being able to see the broken behaviour mentioned in the first sentence for themselves. Update: I thought about this a bit more. Is the intention that people will be writing code at the same time as reading this? I suspect most people will just be reading along and won't go to the effort of writing any code themselves while they're reading. They might tweak tiny bits in the REPL, but that's about it.
Off the top of my head, I'm wondering whether step 2 should just focus on introducing v-bind, while events and v-model could be moved to a separate step?
There was a problem hiding this comment.
@skirtles-code yes, the idea of the tutorial is to let people code on REPL. I am not really sure how we could encourage them to code rather than read only 🤔
There was a problem hiding this comment.
Regarding separating v-bind and events + v-model: this sounds like a good idea 👍🏻
There was a problem hiding this comment.
Split lessons to bite-sized chunks
NataliaTepluhina
force-pushed
the
tutorial-lesson-1
branch
from
a0005a0 to
fa88672
Compare
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
This comment has been minimized.
|
Incredible job @NataliaTepluhina. So excited for the world to see your amazing work on this! 🥳 |
NataliaTepluhina
force-pushed
the
tutorial-lesson-1
branch
from
627d35b to
80045f2
Compare
NataliaTepluhina
force-pushed
the
tutorial-lesson-1
branch
from
30f506c to
4b626e8
Compare
|
@yyx990803 after a brief discussion with docs team we decided to split lessons onto as little chunks as possible so users wouldn't need to read the whole story to finish a particular lesson. Could you please take a look at the new structure? |
yyx990803
force-pushed
the
tutorial-lesson-1
branch
2 times, most recently
from
002d501 to
0ac587d
Compare
yyx990803
force-pushed
the
tutorial-lesson-1
branch
from
0ac587d to
e62aa91
Compare
This PR adds first three lessons to the tutorial. I've implemented also a mechanism to showing the final code of the lesson and switching back to the code user already typed