{"componentChunkName":"component---src-pages-course-list-template-js","path":"/courses/frontend","result":{"pageContext":{"data":[{"node":{"courseTitle":"Front End Web Development Tutorial Course ","courseLength":14,"courseAuthor":"WB Web Dev Solutions","contentful_id":"6tBZ2DErTFLkz7JBibohAA","courseDifficulty":"Begginer","courseDescription":{"courseDescription":"Learn #FrontEndWebDevelopment in 2 weeks with CSS, Javascript and Bootstrap 4. We'll take you from absolute beginner to advanced web developer level in a matter of weeks."},"courseAuthorImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/6RthQSrFTtbmbBhR3IcB2i/66765b7e4f22f5c732565e6e0cbc7cfb/unnamed.jpg"}},"courseImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/1Tn4yrw5d8dggtqG6rcs2H/f019acec37ea1d279d791c626b9100e9/maxresdefault.jpg"}},"courseVideoType":"Playlist","courseSlug":"front-end-web-development-tutorial-course","courseLink":"https://www.youtube.com/playlist?list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj","courseType":"frontend","createdAt":"2020-06-02T21:15:44.256Z","id":"c5c134ea-fb46-506a-b0c1-c7aed614a953","new":true,"coursePlaylist":[{"id":"dLcK76hfCV4","url":"https://www.youtube.com/watch?v=dLcK76hfCV4&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=2&t=0s","url_simple":"https://www.youtube.com/watch?v=dLcK76hfCV4","title":"8. What is CSS ? - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/dLcK76hfCV4/hqdefault.jpg","duration":"3:23","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"WBNtQGLU4Vs","url":"https://www.youtube.com/watch?v=WBNtQGLU4Vs&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=3&t=0s","url_simple":"https://www.youtube.com/watch?v=WBNtQGLU4Vs","title":"9. How to use Inline, Internal and External CSS - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/WBNtQGLU4Vs/hqdefault.jpg","duration":"8:58","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"5IEfRrRMxXc","url":"https://www.youtube.com/watch?v=5IEfRrRMxXc&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=4&t=0s","url_simple":"https://www.youtube.com/watch?v=5IEfRrRMxXc","title":"10. Element, ID and Class Selectors - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/5IEfRrRMxXc/hqdefault.jpg","duration":"10:37","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"EMJYCGaaIUo","url":"https://www.youtube.com/watch?v=EMJYCGaaIUo&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=5&t=0s","url_simple":"https://www.youtube.com/watch?v=EMJYCGaaIUo","title":"11. CSS Colors and Shadows - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/EMJYCGaaIUo/hqdefault.jpg","duration":"14:19","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"NEYLnGV5v6M","url":"https://www.youtube.com/watch?v=NEYLnGV5v6M&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=6&t=0s","url_simple":"https://www.youtube.com/watch?v=NEYLnGV5v6M","title":"12. CSS Backgrounds And Borders - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/NEYLnGV5v6M/hqdefault.jpg","duration":"10:35","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"WJIqIDm7CoA","url":"https://www.youtube.com/watch?v=WJIqIDm7CoA&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=7&t=0s","url_simple":"https://www.youtube.com/watch?v=WJIqIDm7CoA","title":"13. Using browser inspector tools - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/WJIqIDm7CoA/hqdefault.jpg","duration":"13:32","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"BlQo0ZAbELY","url":"https://www.youtube.com/watch?v=BlQo0ZAbELY&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=8&t=0s","url_simple":"https://www.youtube.com/watch?v=BlQo0ZAbELY","title":"14. Combinators in CSS - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/BlQo0ZAbELY/hqdefault.jpg","duration":"5:32","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"tBybvRttDQo","url":"https://www.youtube.com/watch?v=tBybvRttDQo&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=9&t=0s","url_simple":"https://www.youtube.com/watch?v=tBybvRttDQo","title":"15. Grouping in CSS - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/tBybvRttDQo/hqdefault.jpg","duration":"5:33","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"jnfrnyK2MGI","url":"https://www.youtube.com/watch?v=jnfrnyK2MGI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=10&t=0s","url_simple":"https://www.youtube.com/watch?v=jnfrnyK2MGI","title":"16. Specificity in CSS - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/jnfrnyK2MGI/hqdefault.jpg","duration":"15:17","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"6hCA8vsyyrE","url":"https://www.youtube.com/watch?v=6hCA8vsyyrE&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=11&t=0s","url_simple":"https://www.youtube.com/watch?v=6hCA8vsyyrE","title":"17. Text Styling And Formatting - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/6hCA8vsyyrE/hqdefault.jpg","duration":"20:15","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"0UkBJW8KWhc","url":"https://www.youtube.com/watch?v=0UkBJW8KWhc&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=12&t=0s","url_simple":"https://www.youtube.com/watch?v=0UkBJW8KWhc","title":"18. Google Fonts API - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/0UkBJW8KWhc/hqdefault.jpg","duration":"8:16","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"cc6NaiLaTw4","url":"https://www.youtube.com/watch?v=cc6NaiLaTw4&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=13&t=0s","url_simple":"https://www.youtube.com/watch?v=cc6NaiLaTw4","title":"19. Responsive CSS Images - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/cc6NaiLaTw4/hqdefault.jpg","duration":"9:50","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"XovykH6gG50","url":"https://www.youtube.com/watch?v=XovykH6gG50&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=14&t=0s","url_simple":"https://www.youtube.com/watch?v=XovykH6gG50","title":"20. CSS Padding And Margin - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/XovykH6gG50/hqdefault.jpg","duration":"9:43","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"WJZ-Tr9p8SM","url":"https://www.youtube.com/watch?v=WJZ-Tr9p8SM&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=15&t=0s","url_simple":"https://www.youtube.com/watch?v=WJZ-Tr9p8SM","title":"21. CSS Rows And Columns - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/WJZ-Tr9p8SM/hqdefault.jpg","duration":"13:07","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"ohSUKfiuusI","url":"https://www.youtube.com/watch?v=ohSUKfiuusI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=16&t=0s","url_simple":"https://www.youtube.com/watch?v=ohSUKfiuusI","title":"22. Intro to building your first CSS for website - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/ohSUKfiuusI/hqdefault.jpg","duration":"1:16","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"kPPit1B3h6g","url":"https://www.youtube.com/watch?v=kPPit1B3h6g&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=17&t=0s","url_simple":"https://www.youtube.com/watch?v=kPPit1B3h6g","title":"23. Building the Navbar - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/kPPit1B3h6g/hqdefault.jpg","duration":"22:49","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"sLBrE13iAeY","url":"https://www.youtube.com/watch?v=sLBrE13iAeY&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=18&t=0s","url_simple":"https://www.youtube.com/watch?v=sLBrE13iAeY","title":"24. Making the Navbar Mobile Responsive, Part 1 - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/sLBrE13iAeY/hqdefault.jpg","duration":"11:01","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"1XuEwQzprQM","url":"https://www.youtube.com/watch?v=1XuEwQzprQM&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=19&t=0s","url_simple":"https://www.youtube.com/watch?v=1XuEwQzprQM","title":"25. Making the Navbar Mobile Responsive Part 2 - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/1XuEwQzprQM/hqdefault.jpg","duration":"23:45","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"yP05jzDamEU","url":"https://www.youtube.com/watch?v=yP05jzDamEU&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=20&t=0s","url_simple":"https://www.youtube.com/watch?v=yP05jzDamEU","title":"26. Creating the Form Group - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/yP05jzDamEU/hqdefault.jpg","duration":"30:48","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"d4Zb4f4rnL4","url":"https://www.youtube.com/watch?v=d4Zb4f4rnL4&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=21&t=0s","url_simple":"https://www.youtube.com/watch?v=d4Zb4f4rnL4","title":"27. Working with CSS iframes - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/d4Zb4f4rnL4/hqdefault.jpg","duration":"22:18","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"dnM5Dg0BwAs","url":"https://www.youtube.com/watch?v=dnM5Dg0BwAs&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=22&t=0s","url_simple":"https://www.youtube.com/watch?v=dnM5Dg0BwAs","title":"28. Working with CSS images and box shadows - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/dnM5Dg0BwAs/hqdefault.jpg","duration":"42:36","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"8YIhE1vu_zY","url":"https://www.youtube.com/watch?v=8YIhE1vu_zY&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=23&t=0s","url_simple":"https://www.youtube.com/watch?v=8YIhE1vu_zY","title":"29. Working with text and image spacing - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/8YIhE1vu_zY/hqdefault.jpg","duration":"28:26","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"RzSIfJ_ezA8","url":"https://www.youtube.com/watch?v=RzSIfJ_ezA8&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=24&t=0s","url_simple":"https://www.youtube.com/watch?v=RzSIfJ_ezA8","title":"30. Building the footer using CSS - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/RzSIfJ_ezA8/hqdefault.jpg","duration":"18:02","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"zeHTGnv3hvk","url":"https://www.youtube.com/watch?v=zeHTGnv3hvk&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=25&t=0s","url_simple":"https://www.youtube.com/watch?v=zeHTGnv3hvk","title":"31. Introduction to JavaScript Tutorial For Beginners - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/zeHTGnv3hvk/hqdefault.jpg","duration":"8:51","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"UL89325ISSg","url":"https://www.youtube.com/watch?v=UL89325ISSg&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=26&t=0s","url_simple":"https://www.youtube.com/watch?v=UL89325ISSg","title":"32. Javascript Quick References for faster learning - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/UL89325ISSg/hqdefault.jpg","duration":"4:22","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"GrE94gYyB7c","url":"https://www.youtube.com/watch?v=GrE94gYyB7c&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=27&t=0s","url_simple":"https://www.youtube.com/watch?v=GrE94gYyB7c","title":"33. Javascript Comments And How to Link Scripts - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/GrE94gYyB7c/hqdefault.jpg","duration":"7:45","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"TvoJ2fJpJrw","url":"https://www.youtube.com/watch?v=TvoJ2fJpJrw&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=28&t=0s","url_simple":"https://www.youtube.com/watch?v=TvoJ2fJpJrw","title":"34. Javascript Variables And Strings - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/TvoJ2fJpJrw/hqdefault.jpg","duration":"12:58","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"4voQ4PXF28o","url":"https://www.youtube.com/watch?v=4voQ4PXF28o&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=29&t=0s","url_simple":"https://www.youtube.com/watch?v=4voQ4PXF28o","title":"35. Javascript Numbers and Operators - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/4voQ4PXF28o/hqdefault.jpg","duration":"8:04","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"dPDhkI3KJxI","url":"https://www.youtube.com/watch?v=dPDhkI3KJxI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=30&t=0s","url_simple":"https://www.youtube.com/watch?v=dPDhkI3KJxI","title":"36. Javascript comparison operators and conditional operators - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/dPDhkI3KJxI/hqdefault.jpg","duration":"15:41","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"TajRfBY67RE","url":"https://www.youtube.com/watch?v=TajRfBY67RE&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=31&t=0s","url_simple":"https://www.youtube.com/watch?v=TajRfBY67RE","title":"37. Javascript Logical Operators - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/TajRfBY67RE/hqdefault.jpg","duration":"15:20","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"1ibRw6EDzNM","url":"https://www.youtube.com/watch?v=1ibRw6EDzNM&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=32&t=0s","url_simple":"https://www.youtube.com/watch?v=1ibRw6EDzNM","title":"38. Javascript Arrays - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/1ibRw6EDzNM/hqdefault.jpg","duration":"16:18","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"D4NPEFki2c0","url":"https://www.youtube.com/watch?v=D4NPEFki2c0&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=33&t=0s","url_simple":"https://www.youtube.com/watch?v=D4NPEFki2c0","title":"39. Javascript Loops (for, while, do while) - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/D4NPEFki2c0/hqdefault.jpg","duration":"14:23","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"bf8Rg6HsBBY","url":"https://www.youtube.com/watch?v=bf8Rg6HsBBY&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=34&t=0s","url_simple":"https://www.youtube.com/watch?v=bf8Rg6HsBBY","title":"40. Javascript Functions and methods - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/bf8Rg6HsBBY/hqdefault.jpg","duration":"22:20","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"AJ-TdjcHhzY","url":"https://www.youtube.com/watch?v=AJ-TdjcHhzY&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=35&t=0s","url_simple":"https://www.youtube.com/watch?v=AJ-TdjcHhzY","title":"41. Javascript Objects - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/AJ-TdjcHhzY/hqdefault.jpg","duration":"27:06","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"SsT5e50c_Mo","url":"https://www.youtube.com/watch?v=SsT5e50c_Mo&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=36&t=0s","url_simple":"https://www.youtube.com/watch?v=SsT5e50c_Mo","title":"42. Javascript Bind - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/SsT5e50c_Mo/hqdefault.jpg","duration":"8:31","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"77SCFCYq1vI","url":"https://www.youtube.com/watch?v=77SCFCYq1vI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=37&t=0s","url_simple":"https://www.youtube.com/watch?v=77SCFCYq1vI","title":"43. Percentage Calculator & Setting Up the Form with JavaScript - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/77SCFCYq1vI/hqdefault.jpg","duration":"7:57","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"vnBHvI4onVI","url":"https://www.youtube.com/watch?v=vnBHvI4onVI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=38&t=0s","url_simple":"https://www.youtube.com/watch?v=vnBHvI4onVI","title":"44. Percentage Calculator And Grabbing Elements With JavaScript - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/vnBHvI4onVI/hqdefault.jpg","duration":"10:40","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"nWFS0v42uF8","url":"https://www.youtube.com/watch?v=nWFS0v42uF8&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=39&t=0s","url_simple":"https://www.youtube.com/watch?v=nWFS0v42uF8","title":"45. Percentage Calculator using Event Listeners in JavaScript - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/nWFS0v42uF8/hqdefault.jpg","duration":"12:56","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"G02Hd7t0SMI","url":"https://www.youtube.com/watch?v=G02Hd7t0SMI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=40&t=0s","url_simple":"https://www.youtube.com/watch?v=G02Hd7t0SMI","title":"46. Percentage Calculator Algorithm And Prevent Default with JS - Full stack web development Course","thumbnail":"https://i.ytimg.com/vi/G02Hd7t0SMI/hqdefault.jpg","duration":"8:10","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"d7Aww1g6PkE","url":"https://www.youtube.com/watch?v=d7Aww1g6PkE&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=41&t=0s","url_simple":"https://www.youtube.com/watch?v=d7Aww1g6PkE","title":"54. What is Bootstrap ? - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/d7Aww1g6PkE/hqdefault.jpg","duration":"3:13","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"fBw4-7qRyR8","url":"https://www.youtube.com/watch?v=fBw4-7qRyR8&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=42&t=0s","url_simple":"https://www.youtube.com/watch?v=fBw4-7qRyR8","title":"55. Downloading Bootstrap 4 - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/fBw4-7qRyR8/hqdefault.jpg","duration":"3:05","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"EfcMsaWcg7A","url":"https://www.youtube.com/watch?v=EfcMsaWcg7A&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=43&t=0s","url_simple":"https://www.youtube.com/watch?v=EfcMsaWcg7A","title":"56. Bootstrap 4 Project Setup - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/EfcMsaWcg7A/hqdefault.jpg","duration":"7:16","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"-aVPkEDPt0s","url":"https://www.youtube.com/watch?v=-aVPkEDPt0s&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=44&t=0s","url_simple":"https://www.youtube.com/watch?v=-aVPkEDPt0s","title":"57. Overview of Bootstrap 4 Components - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/-aVPkEDPt0s/hqdefault.jpg","duration":"5:58","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"Drr_TAC9XqQ","url":"https://www.youtube.com/watch?v=Drr_TAC9XqQ&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=45&t=0s","url_simple":"https://www.youtube.com/watch?v=Drr_TAC9XqQ","title":"58. Understanding Bootstrap 4 Classes - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/Drr_TAC9XqQ/hqdefault.jpg","duration":"3:16","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"KnDhahDkCCU","url":"https://www.youtube.com/watch?v=KnDhahDkCCU&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=46&t=0s","url_simple":"https://www.youtube.com/watch?v=KnDhahDkCCU","title":"59. Using the Grid System in Bootstrap 4 - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/KnDhahDkCCU/hqdefault.jpg","duration":"18:48","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"bNLEvoznZu4","url":"https://www.youtube.com/watch?v=bNLEvoznZu4&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=47&t=0s","url_simple":"https://www.youtube.com/watch?v=bNLEvoznZu4","title":"60. Bootstrap 4 Cards & Creating a Sign-in Portal Box - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/bNLEvoznZu4/hqdefault.jpg","duration":"19:37","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"pmgLSh-ZoNw","url":"https://www.youtube.com/watch?v=pmgLSh-ZoNw&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=48&t=0s","url_simple":"https://www.youtube.com/watch?v=pmgLSh-ZoNw","title":"61. Bootstrap 4 Forms | Adding an image & input fields - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/pmgLSh-ZoNw/hqdefault.jpg","duration":"16:39","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"q44t3sA1Cq4","url":"https://www.youtube.com/watch?v=q44t3sA1Cq4&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=49&t=0s","url_simple":"https://www.youtube.com/watch?v=q44t3sA1Cq4","title":"62. Bootstrap 4 Adding button and labels in login form - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/q44t3sA1Cq4/hqdefault.jpg","duration":"18:32","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"lh9ow8ziouY","url":"https://www.youtube.com/watch?v=lh9ow8ziouY&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=50&t=0s","url_simple":"https://www.youtube.com/watch?v=lh9ow8ziouY","title":"63. Bootstrap 4 Grids | Finishing Mobile Compatibility - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/lh9ow8ziouY/hqdefault.jpg","duration":"8:30","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"5HRK51QlkwI","url":"https://www.youtube.com/watch?v=5HRK51QlkwI&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=51&t=0s","url_simple":"https://www.youtube.com/watch?v=5HRK51QlkwI","title":"64.  Bootstrap 4 Skate or Die Intro - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/5HRK51QlkwI/hqdefault.jpg","duration":"1:17","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"Ya3nfmqQedQ","url":"https://www.youtube.com/watch?v=Ya3nfmqQedQ&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=52&t=0s","url_simple":"https://www.youtube.com/watch?v=Ya3nfmqQedQ","title":"65.  Bootstrap 4 Working with Navbars - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/Ya3nfmqQedQ/hqdefault.jpg","duration":"10:33","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"dYVadd2qqOU","url":"https://www.youtube.com/watch?v=dYVadd2qqOU&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=53&t=0s","url_simple":"https://www.youtube.com/watch?v=dYVadd2qqOU","title":"66. Bootstrap 4 Jumbotron and Carousels - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/dYVadd2qqOU/hqdefault.jpg","duration":"23:16","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"lx8XApoZj58","url":"https://www.youtube.com/watch?v=lx8XApoZj58&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=54&t=0s","url_simple":"https://www.youtube.com/watch?v=lx8XApoZj58","title":"67. Bootstrap 4 Nesting rows and columns - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/lx8XApoZj58/hqdefault.jpg","duration":"20:56","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"uOlzIM76usg","url":"https://www.youtube.com/watch?v=uOlzIM76usg&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=55&t=0s","url_simple":"https://www.youtube.com/watch?v=uOlzIM76usg","title":"68. Bootstrap 4 Modals and PopUp - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/uOlzIM76usg/hqdefault.jpg","duration":"16:12","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"E8UCCJRumqM","url":"https://www.youtube.com/watch?v=E8UCCJRumqM&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=56&t=0s","url_simple":"https://www.youtube.com/watch?v=E8UCCJRumqM","title":"69. Bootstrap 4 Adding images and buttons - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/E8UCCJRumqM/hqdefault.jpg","duration":"18:59","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"hF0cVwRe8e0","url":"https://www.youtube.com/watch?v=hF0cVwRe8e0&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=57&t=0s","url_simple":"https://www.youtube.com/watch?v=hF0cVwRe8e0","title":"70. Bootstrap 4 Sizing Modals - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/hF0cVwRe8e0/hqdefault.jpg","duration":"18:20","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"BACjnYoVnsc","url":"https://www.youtube.com/watch?v=BACjnYoVnsc&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=58&t=0s","url_simple":"https://www.youtube.com/watch?v=BACjnYoVnsc","title":"71. Bootstrap 4 Building the Footer - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/BACjnYoVnsc/hqdefault.jpg","duration":"7:35","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}},{"id":"Z7oJFC-L0Og","url":"https://www.youtube.com/watch?v=Z7oJFC-L0Og&list=PLwoh6bBAszPqhB09vhMLxQof6cb8tQ2hj&index=59&t=0s","url_simple":"https://www.youtube.com/watch?v=Z7oJFC-L0Og","title":"72. Bootstrap 4 Working with Font Awesome Favicons - Full stack web development Tutorial Course","thumbnail":"https://i.ytimg.com/vi/Z7oJFC-L0Og/hqdefault.jpg","duration":"15:34","author":{"name":"WB Web Development Solutions","ref":"https://www.youtube.com/channel/UCDsEHTvh-YO80AZna7X7UVA"}}],"courseVideoLength":58}},{"node":{"courseTitle":"JavaScript for Beginners Course - Colt Steele","courseLength":3,"courseAuthor":"Colt Steele","contentful_id":"74kXa9SmS64gG08CoAaVio","courseDifficulty":"Begginer","courseDescription":{"courseDescription":"Javascript course from one of the best instructors on udemy, available on youtube. Take a 3 hour journey in Javascript basics and advance your career."},"courseAuthorImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/1hs9uw0v4WiocWn3H2L1E6/c4bf52742076c575e1fa22b7aeea2236/unnamed.jpg"}},"courseImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/676xPCO4yrUajpjDblOqcE/defe83ac20aa94e6ed5adba19eb35b45/maxresdefault.jpg"}},"courseVideoType":"Video","courseSlug":"javascript-for-beginners-course-colt-steele","courseLink":"https://www.youtube.com/watch?v=x2RNw4M6cME","courseType":"frontend","createdAt":"2020-06-01T10:21:20.456Z","id":"a11ef778-a851-5391-9e9b-fbef8fc4294e","coursePlaylist":[{"title":"JavaScript for Beginners Course - Colt Steele","id":"x2RNw4M6cME"}],"new":true}},{"node":{"courseTitle":"JavaScript Crash Course For Beginners","courseLength":2,"courseAuthor":"Traversy Media","contentful_id":"rn5Jpc9k5hRB0v6OSGtcX","courseDifficulty":"Begginer","courseDescription":{"courseDescription":"In this crash course we will go over the fundamentals of JavaScript including more modern syntax like classes, arrow functions, etc."},"courseAuthorImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/14G5Fx7iCaJSnQpfPkmK8a/6bf994189de7cdfe71d2c902d10eaca0/unnamed.jpg"}},"courseImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/7EZ2OMJbnhhPtsxM35SE8K/a328089b0dd79f446496147b6753db3e/maxresdefault.jpg"}},"courseVideoType":"Video","courseSlug":"javascript-crash-course-for-begginers","courseLink":"https://www.youtube.com/watch?v=hdI2bqOjy3c","courseType":"frontend","createdAt":"2020-05-29T21:08:58.184Z","id":"b12c7655-5827-5c2c-8fab-432e05b8f060","coursePlaylist":[{"title":"JavaScript Crash Course For Beginners","id":"hdI2bqOjy3c"}],"new":false}},{"node":{"courseTitle":"Learn HTML5 and CSS3 From Scratch","courseLength":11,"courseAuthor":" freeCodeCamp.org","contentful_id":"C3VB2drMtOZ7BL5Hn6fZX","courseDifficulty":"Begginer","courseDescription":{"courseDescription":"In this course we will cover both HTML and CSS from the scratch and by the end of the course you will be creating your own projects."},"courseAuthorImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/1AxSeBtBXe588JE9ORq7jE/e28a9b6ef89f5d33322edd91e41cf7b3/unnamed.jpg"}},"courseImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/5FvtrBzpeizV5mc0SkUUPX/77383f69be979d097a3abea9ad0b0560/maxresdefault.jpg"}},"courseVideoType":"Video","courseSlug":"learn-html5-and-css3-from-scratch","courseLink":"https://www.youtube.com/watch?v=mU6anWqZJcc","courseType":"frontend","createdAt":"2020-05-29T21:10:53.731Z","id":"fb2b5446-ff4d-5427-b1db-0ebf8a24498a","coursePlaylist":[{"title":"Learn HTML5 and CSS3 From Scratch","id":"mU6anWqZJcc"}],"new":false}},{"node":{"courseTitle":"The 2020 Frontend Developer Crash Course","courseLength":2,"courseAuthor":"DesignCourse","contentful_id":"6OrQ4D4SyuQnPXBRu1y28g","courseDifficulty":"Begginer","courseDescription":{"courseDescription":"Today, you're going to embark on a journey into the world of Frontend Development! In doing so, you're going to utilize HTML, CSS & a tiny bit of JavaScript."},"courseAuthorImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/6L3jUCq7Jx8lPXh42B8koC/10fe2d04099df7fae42bb1b1e2c07ee1/unnamed.jpg"}},"courseImage":{"file":{"url":"//images.ctfassets.net/xu5fvk3m4oyy/3k4G69zBkJRxeuhF1dVzlC/4d19b3c5a01f73b03b948a54c264bda5/maxresdefault.jpg"}},"courseVideoType":"Video","courseSlug":"the-2020-frontend-developer-crash-course","courseLink":"https://www.youtube.com/watch?v=QA0XpGhiz5w","courseType":"frontend","createdAt":"2020-05-29T21:13:22.438Z","id":"60f401ec-ce13-558d-9679-e2098a683214","coursePlaylist":[{"title":"The 2020 Frontend Developer Crash Course","id":"QA0XpGhiz5w"}],"new":false}}],"info":{"title":"Front-end development","subtitle":"Start your programming journey here"}}}}