BartBucknill commented 6 years ago

Both FAC11 and FAC12 (London) have found the size of this refactoring exercise confusing. The detailed instructions provided for FAC12 provided a better experience than that of FAC11, but there remained considerable confusion.

I think that the cognitive load resulting from the large number of files and large amount of content makes it difficult for students to focus on the core purpose of the workshop: learning handlebars.

For future iterations perhaps we should consider, either:

significantly reducing the size of the refactoring exercise

or:

not having it as a refactoring exercise at all, but rather as a new build exercise.

eliasmalik commented 6 years ago

@BartBucknill if we halve the number of fruits to 7, do think that is enough?

BartBucknill commented 6 years ago

@eliascodes I don't think that halving the number of fruits alone would have much effect, when you can do one you can do all of them. TBH, I'm not sure how best to reduce the size of the refactoring to reduce the cognitive load. Maybe it shouldn't be a refactoring exercise at all.

jamiecoe commented 6 years ago

@eliascodes I believe our updated instructions for #12 have made this issue irrelevant. Can it be closed?

thejoefriel commented 6 years ago

Hi @BartBucknill - on fac14 and doing curriculum review. I can see that this issue may have been resolved? Or you ok if this is closed?

BartBucknill commented 6 years ago

@thejoefriel Based on a quick look at the README it seems to me that this is still a large refactoring task. However, if you and your cohort believe that this issue is no longer relevant/the problem has been solved, please go ahead and close it 👍

m4v15 commented 5 years ago

@arrested-developer @VirtualDOMinic @Armand-Lluka

Not sure if you guys agree, but I think @BartBucknill makes some good points re: this workshop - I'm not sure it does a great job of introducing why handlebars is a good tool to use, or even how to use it well. I might not do this workshop in FACK1 and will try to develop another workshop introducing hbs, along these lines:

Handlebars

What is templating/SSR presentation

Talk through flow of week 6 project
- Request for home route (HTML), request for JS, request for data, manipulate the DOM
Wouldn't it be cool if we did this alllll in one request and didn't have to manipulate the DOM
- get the data on the home route straight away, insert it into the HTML
Could do this easily enough - make a function that takes data, produces an HTML string out of it, send that

Presentation

Repo with CSR vs. SSR of the same thing

Make presentation with live examples of the above

Handlebars!

Potential Jumping of point for an intro into handlebars

Handlebars is just a simple way of doing exactly that without having to make a lot of functions

Short express handlebars walkthrough - basic set up, render a couple of pages, pass in some context.

Challenge

Give them the current challenge/do the below as a challenge:
- ~start with small app vanilla node app that is making requests and doing DOM manipulation~
- ~Convert into express handlebars app~
- Repo here: Challenge is in 2 parts, short walkthrough to get it set up, then they have to display some JSON data using different views.

I will share things with you guys as I make them, should be done by Saturday night at the latest.

arrested-developer commented 5 years ago

I think the why is missing from the original workshop in a big way. I like how you're giving context first. In FAC14 the concept of templating confused some people so we discussed where you might have seen it used a lot without realising (blogs, Amazon search, etc.) - even after we use a lot of DOM manipulation, some people will have the preformed misconception that every page that they see in their browser exists somewhere on the server as HTML, and by doing an Amazon search, for example, you just get the "right" HTML page for your search

m4v15 commented 5 years ago

Dropping this here as a reminder to myself of decent intro to handlebars without any other intellectual overhead:

https://www.sitepoint.com/a-beginners-guide-to-handlebars/

m4v15 commented 5 years ago

@arrested-developer @VirtualDOMinic @Armand-Lluka

This is my first swing at an introductory presentation if you want to use in london (see the presentation notes for more detail):

https://docs.google.com/presentation/d/1AHAMQxpudl0zwwR2yADIoB7Luf58urJpKaqqTb1dhu0/edit?usp=sharing

m4v15 commented 5 years ago

Addtionally, I've made this repo to compare various way's of doing a CMS:

https://github.com/m4v15/templating

mattlub commented 5 years ago

@m4v15 my 2 cents:

I like the intro, and e.g. the idea from @arrested-developer, prompting students to suggest how, e.g. an Amazon product page is served.

Wouldn't it be cool if we did this alllll in one request

I know you know, but I think it's important to check the students know 'cool'='much more performant' in this case (and why it's the case- side note: performance is not really explicitly touched on at all in the course, so a small explicit thing here could be good).

Also students should be prompted to say when Client side rendering is good (i.e. updating components, like a twitter feed or whatever), just so it doesn't seem like we're saying no to CSR.

re the challenge-

maybe better not to convert from vanilla node to express, because otherwise students might think handlebars is someway linked to express (I know hopefully they will understand this is not the case from the intro but still)
isn't setting up handlebars with express a tiny bit fiddly (and uninteresting), and could be better as a walkthrough than a challenge?
making them convert from CSR to SSR may be bad because of the reason above, about thinking CSR is bad. Also a refactoring exercise is generally hard if you're a bit lost (is that what this issue was originally about?).

suggestion:

A suggestion for the challenge (or part of it) could be to walkthrough setting up handlebars with express, then they have to fix the handlebars templates (i.e. they start as just html).

Also, not sure if this is the place for this comment but I think templating and handlebars (at least in a simple form) should be introduced in week 5 😉 (cc @eliascodes)

yikes sorry @m4v15 this was longer than I anticipated :D (edit: also I hadn't seen your last 3 comments when I wrote it)

disclaimer: I haven't actually seen this week being taught so don't have such good knowledge of what the problems are, so feel free to take my comments with a pinch of salt if you know better ;)

m4v15 commented 5 years ago

@mattlub

the comment above was just a very rough guide as to what I was gonna do not actually what I was gonna say to the students...

Have a look at the presentation and the repo, I think most of your points were already covered.

My current plan is.

Give the above presentation, combined with showing the repo. I estimate this will take about 30-45 minutes overall, with showing the code in that repo.
Code-along walk through of setting up final version in that repo. Hopefully, this should not take too long, 20 minutes

Still needs to be made: 🙃

Give them an HTML page and get them to use handlebars instead - maybe using if's and each loops and making a helper and partial them selves. 1 hour

m4v15 commented 5 years ago

Update, I have made a very rough draft of the challenge, see here: https://github.com/m4v15/country-express

Basically the aim is more to teach hbs syntax. I decided to go with giving them data and using HBS to change it, rather than converting from HTML to handlebars, as I feel that is a better reflection of what you will actually be doing when you are using handlebars most of the time. I plan to finish this off tomorrow, but feel free to have a look now @mattlub @VirtualDOMinic @Armand-Lluka although it might be hard to understand right now

So the new plan is:

Give the above presentation, combined with showing the repo, and showing throttling. I estimate this will take about 30-45 minutes overall, with showing the code in that repo.
Go to this repo: https://github.com/m4v15/country-express.
Code along to have a home page display username and header, and have links to 2 more pages. 20 minutes
Have them try and do the challenges. 40 minutes
Cast solutions 15 minutes

m4v15 commented 5 years ago

The presentation/example repo/workshop are now all finished if people are interested in checking them out (no worries if not)

Armand-Lluka commented 5 years ago

@m4v15 Hey will defo check it out 👍

m4v15 commented 5 years ago

@Armand-Lluka @VirtualDOMinic

Just did them here, they went really well, but they are definitely a bit long, here were my timings:

Presentation, including walkthrough of templating repo 45 minutes
short break 5 minutes
Walkthrough for setting up handlebars ( I also got them started on challenge 1 - got them to the point of rendering a new view, but had them investigate how to use #each and #if 30 minutes
Up to the end of part 3 (some people started part 4) 50 minutes

And then we had to stop. Notes:

generally went well, a lot of chances to ask them questions and check understanding
go very slow for fiddly setting up of express-handlebars
people didn't know where to start for challenge 1, hence the walkthrough just made a new view and route, left them to research the helpers
challenge 2 is just copy and pasting challenge 1 really, not a huge amount of point
challenge 3, no one could find the bit in the docs which says how to set the partialsDir might just be better to show them - we were running out of time so I ended up just doing challenge 3 as a walkthrough as no one could get past setting up partials directory. Probably would be better to walk through making the partial and adding the directory in exphbs() config, and then have the students research it.

Feel free to ask anything here if you want more feedback. There is a danger that stuff here overlaps with stuff in the MC but I think just reinforcing things is not the worst thing in the world.

VirtualDOMinic commented 5 years ago

@m4v15 great job on the workshop! Largely went well with us, too. Some small changes/issues, some which overlap with yours (e.g. partialsDir). I'll make a PR for your repo at some point soon :)

oliverjam commented 5 years ago

@VirtualDOMinic when you say "went well with us" do you mean you didn't do the workshop in this repo?

@m4v15 your workshop looks great. Are you still using it in place of this one? I'm not convinced this is a great intro as it's really complicated considering it's just supposed to introduce Handlebars.

I've always thought we should start introducing this concept earlier on with template literals, since they're literally templating 🙄

e.g. every project has some

response.end("<h1>Server Error</h1>");

in it. Upgrade that to

response.end(`<h1>Server error: ${error.message}</h1>`);

and boom, you're templating.

m4v15 commented 5 years ago

@oliverjam I'm pretty sure @VirtualDOMinic used my workshops, but not 100%.

WRT is it still being used, I don't know - We used it for Khaleel, but I don't think it was used in the most recent Gaza round. I think FAC16 haven't got here yet (cc: @charlielafosse ) so don't know if they are planning on using it, but I think they probably are.

I'd say this is probably good to get merged, but then I am a bit biased.

I agree about about introducing templating earlier, but I guess that maybe requires a little bit more thought to find the space when (@mattlub suggests week 5 above) and how that would change the structure of the 8 weeks

oliverjam commented 5 years ago

FAC16 definitely did the workshop in this repo (there's an issue raised by one of them 2 days ago).

I think they struggled with it a bit, so maybe we should make the decision to switch over to your one officially until we can sort something out long-term?

m4v15 commented 5 years ago

I agree - this is the schedule we used in Khalil (this is workshop 3)

https://github.com/m4v15/master-reference/tree/master/coursebook/week-8

Armand-Lluka commented 5 years ago

@oliverjam @m4v15

We definitely didn't use the fruits workshop, the broad consensus was that it felt too bloated trying to do too much.

The feedback at the time from FAC15 on the alternative provided seemed mostly positive. I also recommend it gets merged.

foundersandcoders / express-handlebars-workshop

Is this workshop too big? #16

Handlebars

What is templating/SSR presentation

Handlebars!

Challenge