cmda-bt / fe-course-22-23

🎓 Front-end 2 · 2022-2023 · Curriculum and Syllabus
MIT License
22 stars 2 forks source link

Week 1 - Joppe Koops #18

Open joppekoops opened 1 year ago

joppekoops commented 1 year ago

Enhancement

Name

Joppe Koops

Class

Tech 2

Repo link

Repo: https://github.com/jkhvacmd209/blok-tech Wiki: https://github.com/jkhvacmd209/blok-tech/wiki/Enhancement

Summary

I started this week with refreshing my knowledge about JavaScript with the assignments on GitHub. This went very well. I did some research on progressive enhancement, mostly looking at other websites (almost everything is not correctly progressively enhanced). I also made a little start with my own feature and built an input for images.

Resources used

Any thoughts?

Most of the homework was doable, but the part about server vs. client side and the API's was a little difficult because I don't know what is possible there yet.

Chazzers commented 1 year ago

Hi Joppe, studentassistent here (I don't know if I should respond in English or Dutch...)!

So to elaborate on your remark on the server vs client side... Basically what you need to do for this subject is create a progressive enhancement. This basically means adding layers that improve a feature with each added layer. The base layer is HTML, then you add the layer css, and afterwards you add the layer client-side js. Each layer here improves UX.

Now if you were to turn off javascript in your browser, which is the part you will be tested on, your feature still needs to work. But turning off JS in the browser won't mean that the JS on the server will be turned off as well. Meaning you can make a feature work server-side, and then enhance that feature with client-side JavaScript. This means if you turn off client-side javascript your feature will still work.

For example with the feature liking: Server-side and html:

I hope this helps! If you've got any other troubles, or run into issues and need some help, don't be afraid to reach out to me or any of the other studentassistents!