gaspersic/developer-roadmap
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add DOM and JavaScript resources

Browse Source
This commit is contained in:
Kamran Ahmed
2021-12-10 23:31:26 +01:00
parent 5f44649f5e
commit 712d65d0e6
4 changed files with 22 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
content/roadmaps/100-frontend/content/103-javascript/100-syntax-and-basic-constructs.md
View File

@ -1 +1,9 @@
# Syntax and basic constructs
# JavaScript
JavaScript allows you to add interactivity to your pages. Common examples that you may have seen on the websites are sliders, click interactions, popups and so on.
<ResourceGroupTitle>Free Content</ResourceGroupTitle>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://www.w3schools.com/js/'>W3Schools – JavaScript Tutorial</BadgeLink>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://javascript.info/'>The Modern JavaScript Tutorial</BadgeLink>
<BadgeLink badgeText='Watch' href='https://youtu.be/hdI2bqOjy3c?t=2'>JavaScript Crash Course for Beginners</BadgeLink>
<BadgeLink badgeText='Watch' href='https://youtu.be/P7t13SGytRk?t=22'>Build a Netflix Landing Page Clone with HTML, CSS & JS</BadgeLink>

12
content/roadmaps/100-frontend/content/103-javascript/101-learn-dom-manipulation.md
View File

@ -1 +1,11 @@
# Learn dom manipulation
# DOM Manipulation
The Document Object Model (DOM) connects web pages to scripts or programming languages by representing the structure of a document—such as the HTML representing a web page—in memory.
<ResourceGroupTitle>Free Content</ResourceGroupTitle>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://www.freecodecamp.org/news/what-is-the-dom-document-object-model-meaning-in-javascript/'>What is the DOM?</BadgeLink>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://www.w3schools.com/js/js_htmldom.asp'>JavaScript HTML DOM</BadgeLink>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://www.javascripttutorial.net/javascript-dom/'>JavaScript DOM</BadgeLink>
<BadgeLink badgeText='Watch' href='https://www.youtube.com/watch?v=7Tok22qxPzQ'>What is DOM, Shadow DOM and Virtual DOM?</BadgeLink>
<BadgeLink badgeText='Watch' href='https://www.youtube.com/watch?v=0ik6X4DJKCc'>JavaScript DOM Crash Course</BadgeLink>

1
content/roadmaps/100-frontend/content/103-javascript/readme.md
View File

@ -2,6 +2,7 @@
JavaScript allows you to add interactivity to your pages. Common examples that you may have seen on the websites are sliders, click interactions, popups and so on.
<ResourceGroupTitle>Free Content</ResourceGroupTitle>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://www.w3schools.com/js/'>W3Schools – JavaScript Tutorial</BadgeLink>
<BadgeLink badgeText='Read' colorScheme="yellow" href='https://javascript.info/'>The Modern JavaScript Tutorial</BadgeLink>
<BadgeLink badgeText='Watch' href='https://youtu.be/hdI2bqOjy3c?t=2'>JavaScript Crash Course for Beginners</BadgeLink>

2
public/project/frontend.json
View File

@ -6138,7 +6138,7 @@
"x": "160",
"y": "1108",
"properties": {
"controlName": "package-managers"
"controlName": "100-package-managers"
},
"children": {
"controls": {