Skip to content

Instantly share code, notes, and snippets.

@JoeVan21

JoeVan21/week-3.md

Created January 29, 2023 19:34
Show Gist options
  • Save JoeVan21/d90133e41a75df1e03a173a86ab4a76c to your computer and use it in GitHub Desktop.
Save JoeVan21/d90133e41a75df1e03a173a86ab4a76c to your computer and use it in GitHub Desktop.
Download ZIP
Raw
week-3.md

Homework 3

Joseph Vanacore

Link to Codepen

https://codepen.io/JoeVan21/pen/VwBrgBv

Video 1

What made the idea viable?

  • Since the highlighting issue has an open source code file that can ne inspected and fixed, makes the overall idea viable.

What is the original issue with the Lit code highlighter?

  • The lines being presented at the start of the video are not being highlighted properly which is causing other lines to be highlighted without being commanded to. Instead of the lines being properly highlighted, the lines are getting boxed in which makes the code appear to be highlighted. Changing the width of the box wil change the size of what is being highlighted.

What’s a strategy you can engage in in order to refactor toward better code? What strategy / how many iterations did I go through to get “better code”? - What makes this code better?

  • Throughout the video, many examples were provided in how the code can be altered and modified using many diffrent systems. One of the systems used is highlight.js which takes in and passes code through the software, in which new code with the correct highlight capabilites will be shown. This can be an example in which your code gets refactored to successfully process. Another example is going through GitHub and seeing how other people/companies refactored code to work, however keeping an eye on forks, stars, and having a MIT license is important so that you are granted permission to use that code. One of many stratagies also used was using sudo class/object which helps identifty the element that may need change. Overall there were many iterations of codes, examples, and softwares to find the solution. Going back from github to css to html, combing all the pieces of code to form the solution.

Video 2

What weird event did I implement to solve a UX problem?

  • To solve the pausing issue between tabs when running music/movie files on a website is solved by implementing an event called "visibility change" on top of the event listener. This sets the tab to play when visible, however when you tab out or swtich tabs, the background music/movie will pause instantly.

What is the difference between document and window in javascript? Find the Mozilla Developer Network page about this.

  • A window in javascript is represented as a holder which contains a DOM document (Document Object Model) which is taken from a root onject is JS. A document within JS indicates the object points loaded into the DOM document window. The main purpose of a document is that it can be used for manipulation within the document.
  • Source- https://developer.mozilla.org/en-US/docs/Web/API/Window

Find 8 events that user input can generate via the MDN Web Docs. Link to examples

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment