D4mations.com

Tag: coding

  • Virtual Keyboard in JavaScript – HTML, CSS & JavaScript Tutorial (Project Video)

    Link to code: Google Material Icons: https://google.github.io/material-design-icons/#icon-font-for-the-web In this video we’ll be creating a virtual keyboard using pure HTML, CSS & JavaScript (no libraries required). This is done from scratch and is easy to integrate, responsive and touch-friendly. I think projects like this are super helpful for learning web development or specifically HTML, CSS, &…

  • 16.7: Array Functions: reduce() – Topics of JavaScript/ES6

    In this video, I cover the JavaScript array function reduce(). 🎥 Next Video: https://youtu.be/qmnH5MT_luk 🔗 MDN’s Array Documentation: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array 🚂 The Coding Train website: http://thecodingtrain.com/ 💖 Support this channel on Patreon: https://patreon.com/codingtrain 🛒 To buy Coding Train merchandise: https://www.designbyhumans.com/shop/codingtrain/ 📚 Book recommendations: https://www.amazon.com/shop/thecodingtrain 💻 https://github.com/CodingTrain/Rainbow-Code 🎥 For an Introduction to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA 🎥 For More…

  • Building a full stack WEB SCRAPING app with JAVASCRIPT tutorial

    By request here is a full stack JavaScript app that uses web scraping — complete with a front end, API server, scraper and database. Here’s the code: https://github.com/aj-4/setuptourist Our stack (100% JavaScript) == HTML / CSS / Vanilla JS (no framework) == Express == Puppeteer == TypeORM == mySQL Are you lost? ——————— Check out…

  • Loading data into HTML Tables using AJAX – JavaScript Tutorial

    In most medium-to-large sized websites or applications, it’s ideal to separate your data from your HTML markup. One way to achieve this is by creating a structure in HTML and then loading the data separately from a dedicated data-file. AJAX is a method of loading data into a web page once it has finished loading…

  • JavaScript Tutorial – "unload" event | Detect when the browser window has closed

    By using the “unload” event in JavaScript you are able to detect when the window has closed. In the case of an iframe, it is possible to detect when the src attribute has been removed or changed. In this video we take a look at an example of the “unload” event in the case of…

  • Zoom Effect – CSS and JavaScript tutorial – Day 30

    In this tutorial we’re going to learn how to create a Zoom Effect using #CSS and #JavaScript. We are going to play around with the ‘mouseover’ and ‘keydown’ events in JavaScript and also the ‘transform scale’ and ‘transform-origin’ property in CSS. #31Days31Videos 📹 Playlist: https://www.youtube.com/playlist?list=PLgBH1CvjOA62ktHHwqSYBeq4jmGmUezNo 💻 Code on CodePen: https://codepen.io/FlorinPop17/pen/ZEYNjRQ — Support my channel: 💜…

  • Bootstrap Grid – CSS Grids Series (Intro)

    Bootstrap Grid – CSS Grids Series (Intro)

    [ad_1] https://i.ytimg.com/vi/0QlecDOWHmY/hqdefault.jpg Today we start a new series called CSS Grids. We are going to build and re-build the same layout with different grid frameworks. Watch this video in the playlist: *link Link of the week: http://www.gridlover.net/ Winning Tweet: https://twitter.com/f0vela/status/531858154556907522 — DevTips is a YouTube show about web design and development. “HTML5 Basics” Playlist: “CSS…

  • Animated Sidebar Menu – CSS and JavaScript tutorial – Day 31

    In this tutorial we’re going to use #CSS and a little bit of #JavaScript to create a nice Animated Sidebar Menu. #31Days31Videos 📹 Playlist: https://www.youtube.com/playlist?list=PLgBH1CvjOA62ktHHwqSYBeq4jmGmUezNo 💻 Code on CodePen: https://codepen.io/FlorinPop17/pen/jOEjzOv — Support my channel: 💜 Join the Discord community 👨‍👩‍👧‍👦 by becoming a patron: https://www.patreon.com/florinpop17 💜 One time donations via PayPal: https://paypal.me/florinpop17 Thank you! 🙏…

  • Accessing an iframe document (contentWindow) – JavaScript Tutorial

    In this video we take a look at the contentWindow and contentDocument properties of an embedded iframe – it allows access to the underlying “window” and “document” objects of the HTML page. Support me on Patreon: https://www.patreon.com/dcode – with enough funding I plan to develop a website of some sort with a new developer experience!…

  • Create a Navigation Bar with Icons – HTML, CSS & JavaScript Tutorial | Web Design

    In this video we’ll be creating a stylish navigation bar with icons, using plain HTML, CSS and JavaScript. The icon library used will be Google Material Icons, which you can read the documentation for here: https://material.io/tools/icons/ To include Google Material Icons on your web page, add this to your head: https://fonts.googleapis.com/icon?family=Material+Icons Support me on Patreon:…