learn-co-curriculum / phase-1-stitching-together-the-three-pillars Goto Github PK
View Code? Open in Web Editor NEWLicense: Other
License: Other
https://my.learn.co/courses/650/assignments/32962?module_item_id=83207
Very much enjoying this course. Thank you!
I know this probably will sound “pedantic”, but to quote Steve Jobs:
“Details matter. It's worth waiting to get it right."
In both lessons: Defining Front-End Web Programming and the beginning of Stitching Together the Three Pillars -
The 3 pillars are listed in this order:
• Recognize Events
• Manipulate the DOM
• Communicate with the Server
but then for some reason, the order is switched mid lesson (grrr :):
Identify the Three Essential Pillars of Front-End Web Programming
We've introduced our three essential pillars of front-end web programming:
• Manipulating the Document Object Model (DOM)
• Recognizing JS events
• Communicating with the server
It would be helpful to keep the order consistent.
• Recognizing JS events
• Manipulating the Document Object Model (DOM)
• Communicating with the server
This would also require updating the lesson comments.
In demo.js, the comments say:
// STEP 1: The line of code below is what lets JavaScript find the elements that
// we want to make clickable. Without JavaScript, clicking on these heart shapes
// does nothing. Uncomment the code and refresh the demo page.
const articleHearts = document.querySelectorAll(".like-glyph");
If you keep the order of the 3 pillars consistent (Events, Manipulate, Communicate),
Then the Step 1 comment in demo.js could logically be connected to the first pillar.
We are using the ".like-glyph" element in our effort to “Recognize the Event”.
The comment would need to reflect that this is just the initial part of the first pillar.
The second part of the first pillar will be the click event, which comes later in the Step 3 comment.
So an updated Step 1 comment might look like this:
// STEP 1: The line of code below is what lets JavaScript find the elements that
// we want to make clickable. Without JavaScript, clicking on these heart shapes
// does nothing. This is the first part of Pillar 1. The other part of Pillar one will come later.
// Uncomment the code and refresh the demo page.
Then, the comment for Step 2 could logically be connected to the second pillar -
Manipulate the DOM
So this comment would need to be updated from this
// STEP 2: Uncomment the 3 lines after the alert.
// Here we're using Pillar 1 (DOM Manipulation) to update the screen and
// mimicking Pillar 3 (Server Communication) to only update the screen if
// the sending of information to the server succeeds.
to something like this:
// STEP 2: Uncomment the 3 lines after the alert.
// Here we’re using Pillar 2 (DOM Manipulation) to update the screen and
// mimick Pillar 3 (Server Communication) to only update the screen if
// the sending of information to the server succeeds.
Finally, in the Step 3 comment
change this:
// STEP 3: In order for the call to the server and the update of the screen to
// work, we need to add a click event listener to the elements we identified in
// STEP 1. That's Pillar 2, event handling. Uncomment this code:
to something like this:
// STEP 3: In order for the call to the server and the update of the screen to
// work, we need to add a click event listener to the elements we identified in
// STEP 1. That's the other part of Pillar 1, event handling. Uncomment this code:
for (const glyph of articleHearts) {
glyph.addEventListener("click", likeCallback);
}
I very much believe this would be more consistent and more logical for students.
Also, while I’m being a pain in the butt,
the professional look of the Canvas app would benefit much by addressing the many translation warnings in the console.
Canvas looks to be Rails based.
RAILS is referenced in the view source, and there are a lot of forum questions online about missing translation -spans issues with Rails.
In a course on web development, it would be a big win to address those “Translation for _ is missing” warnings in the console.
My Rails experience is almost non existent, so this is way over my head, but I found these recommendations below online may which may be helpful. They seem to depend on the version of Rails you’re using.
https://guides.rubyonrails.org/v4.0.0/i18n.html
https://stackoverflow.com/questions/12914019/rails-remove-missing-translation-errors
Sorry to be such a nuisance, but I think it comes with the territory.
On the bright side, I'll be out of your hair in a few months :).
Thanks for your patience.
No response
https://learning.flatironschool.com/courses/4992/assignments/165658?module_item_id=357280
Lack of .gitignore
Students may be pushing node_modules and results.json to their repos, unnecessarily taking up space/bandwidth :)
No response
Add a .gitignore to root!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.