dcode
dcode
  • 763
  • 19 932 599
The Easiest Way to Add Icons to Your Website
Let me show you the easiest way to add icons to your website. An easy 2-step process using the Ionicons icon library!
Ionicons:
ionic.io/ionicons
🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/
🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme
💜 Join my Discord Server - discord.gg/TXMQyvbpcA
🐦 Find me on Twitter - dcodeyt
💸 Support me on Patreon - www.patreon.com/dcode
📰 Follow me on DEV Community - dev.to/dcodeyt
📹 Join this channel to get access to perks - ua-cam.com/channels/jX0FtIZBBVD3YoCcxnDC4g.htmljoin
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
#dcode #webdevelopment
Переглядів: 439

Відео

How to Access the Webcam - Easy JavaScript Tutorial
Переглядів 7624 години тому
In today's video I'll show you how easy it is to access and show the webcam feed using JavaScript. For your reference, check this out: developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA...
How To Setup Your First React + TypeScript Project With Vite
Переглядів 66414 днів тому
Let's have a look at how to setup a React TypeScript Project with Vite - an alternative to using Create React App. For your reference, check this out: vitejs.dev/guide/ 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA 🐦 Find me on Twitter - twitter.c...
How To EASILY Add Tooltips To Your Website - HTML, CSS & JavaScript Tutorial
Переглядів 79414 днів тому
Let's have a look at how to add tooltips to your website using HTML, CSS & JavaScript. This can be done using the Tippy.js library. For your reference, check this out: atomiks.github.io/tippyjs/ 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA 🐦 Find...
How To Create a Banner - React, Tailwind CSS & TypeScript Tutorial
Переглядів 784Місяць тому
In today's video, I'll show you how to build a Banner component using React, Tailwind CSS and TypeScript. This is a reusable component with different variants such as info, success, warning and error. 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA ...
5 Ways to Create Arrays in JavaScript
Переглядів 1 тис.Місяць тому
Let's have a look at a few different ways to create arrays in JavaScript 😎 For your reference, check this out: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/Array 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA 🐦 Fin...
How to Truncate Text with CSS - Resolving Common Issues
Переглядів 1,3 тис.Місяць тому
In today's video I'll be showing you how to truncate text (single line) with CSS and going over some of the common issues you may face and how to solve them. For your reference, check this out: developer.mozilla.org/en-US/docs/Web/CSS/text-overflow 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜...
Get Selected Text with JavaScript: Quick & Easy Tutorial
Переглядів 1,3 тис.2 місяці тому
In this video, let's have a look at how to get the currently selected text on a web page using JavaScript. I'll also be showing you how to react to when your user changes their text selection. For your reference, check this out: developer.mozilla.org/en-US/docs/Web/API/Window/getSelection 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstud...
How to Style Username and Password Input Fields - HTML & CSS Tutorial
Переглядів 1,5 тис.2 місяці тому
In today's video I'll show you how to build a set of inputs to represent a username and password combo for your website. We then use CSS to add some extra flavour to the design. 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA 🐦 Find me on Twitter - ...
If You Use JSON, Try This - Formatter Extension & Knowing Your Content Type
Переглядів 1,2 тис.2 місяці тому
Let's have a chat about JSON and returning the correct Content-Type from your APIs. As a bonus, we look at a Chrome extension to format JSON responses and compare it to Firefox. JSON Formatter Chrome Extension: chromewebstore.google.com/detail/json-formatter/bcjindcccaagfpapjjmafapmmgkkhgoa For your reference, check this out: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Obje...
Build a Mock Data API with Node.js & Express
Переглядів 1,9 тис.3 місяці тому
Let's have a look at how easy it is to build an API which returns lists of mock data - perfect for testing apps or UI components 😎 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA 🐦 Find me on Twitter - dcodeyt 💸 Support me on Patreon - w...
Create Your Own Input Field with JavaScript Web Components
Переглядів 2,3 тис.3 місяці тому
In today's video I'll show you how to build your own custom input field using web components. It'll support features such as adding an error message programmatically, and forwarding on some attributes. 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA...
3 Of The BEST Icon Packs For Web Developers - Colors, Sizing, Animations & More!
Переглядів 1,9 тис.3 місяці тому
In today's video we'll have a look at 3 of the best icon libraries for web developers. All of these can be installed via npm, are open source and easy to use 😎 Ionicons: ionic.io/ionicons Google Material Symbols: fonts.google.com/icons Boxicons: boxicons.com/ 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dc...
How to Add Badges to Your Buttons - HTML & CSS Tutorial
Переглядів 1,4 тис.3 місяці тому
In this video I'll be showing you how to create buttons with badges using HTML & CSS. These can be useful for promoting new features, or for things such as notification badges. 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - marketplace.visualstudio.com/items?itemName=dcode.dcode-theme 💜 Join my Discord Server - discord.gg/TXMQyvbpcA 🐦 Find me on Twitter - t...
How to React to When an Object Changes in JavaScript
Переглядів 1,2 тис.3 місяці тому
In today's video I'll show you how you can use the Proxy object in JavaScript to react to when an object changes. We also have a look at an example of building a reactive UI using this technique. For your reference, check this out: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Proxy 🏫 My Udemy Courses - www.udemy.com/user/domenic-corso/ 🎨 Download my VS Code theme - m...
How to Send Data From iframe To Parent Page - JavaScript postMessage Tutorial
Переглядів 3,4 тис.3 місяці тому
How to Send Data From iframe To Parent Page - JavaScript postMessage Tutorial
How To Create Styled External Links & Icon with HTML & CSS
Переглядів 1,4 тис.4 місяці тому
How To Create Styled External Links & Icon with HTML & CSS
Using The CSS Object in JavaScript
Переглядів 1,7 тис.4 місяці тому
Using The CSS Object in JavaScript
A Simple Explanation of Recursion
Переглядів 1,1 тис.4 місяці тому
A Simple Explanation of Recursion
How to Add Scrolling & Sticky Headers to HTML Tables with CSS
Переглядів 7 тис.4 місяці тому
How to Add Scrolling & Sticky Headers to HTML Tables with CSS
How To Remove Duplicates From an Array in JavaScript
Переглядів 2 тис.5 місяців тому
How To Remove Duplicates From an Array in JavaScript
How to Use Slots With JavaScript Web Components
Переглядів 3,5 тис.5 місяців тому
How to Use Slots With JavaScript Web Components
How to Create Your Own Context Menu with Icons Using HTML, CSS & JavaScript
Переглядів 2,7 тис.5 місяців тому
How to Create Your Own Context Menu with Icons Using HTML, CSS & JavaScript
How to Animate CSS Properties with JavaScript
Переглядів 3,2 тис.5 місяців тому
How to Animate CSS Properties with JavaScript
What Exactly Are Nodes In The JavaScript DOM?
Переглядів 4,1 тис.6 місяців тому
What Exactly Are Nodes In The JavaScript DOM?
How to Create Expandable Sections with HTML, CSS & JavaScript
Переглядів 2,7 тис.6 місяців тому
How to Create Expandable Sections with HTML, CSS & JavaScript
How to Add CSS to Your Web Components - JavaScript Tutorial
Переглядів 2,4 тис.6 місяців тому
How to Add CSS to Your Web Components - JavaScript Tutorial
5 Chrome Dev Tools Every Web Developer Should Know
Переглядів 2,4 тис.6 місяців тому
5 Chrome Dev Tools Every Web Developer Should Know
How to Easily Add Smooth Scrolling to Your Website - JavaScript Tutorial
Переглядів 4,6 тис.6 місяців тому
How to Easily Add Smooth Scrolling to Your Website - JavaScript Tutorial
How to Create a Styled Table with Web Components - JavaScript Tutorial
Переглядів 5 тис.6 місяців тому
How to Create a Styled Table with Web Components - JavaScript Tutorial

КОМЕНТАРІ

  • @BcomingHIM
    @BcomingHIM 5 годин тому

    Man I love how to use good coding practices and not just put everything into one place. Will follow your playlist to learn these good practices.

  • @mickmc1498
    @mickmc1498 6 годин тому

    how does one find the youtube like url so i can add my auto clicker

  • @hugnt
    @hugnt 17 годин тому

    Bro, can i upload an existing pdf file then adding an image on it?

  • @peaps
    @peaps 18 годин тому

    That's great, thanks. I just styled it in Tailwind classes and it works perfectly. Cheers.

  • @mpsbrasilia
    @mpsbrasilia 23 години тому

    Criar um vídeo, usando uma sidebar com webcomponents, por favor.

  • @pccassist
    @pccassist День тому

    Good video and explaination ❤

  • @bmehder
    @bmehder День тому

    I noticed the word "enviorment" is misspelled. It doesn't seem to matter though. Perhaps "environment" is the default?

  • @alexdin1565
    @alexdin1565 День тому

    the only youtuber who don't answer to comments I will unsubscribe thanks

  • @iamtharunraj
    @iamtharunraj День тому

    Parcel is too slow when installing it using npm. Vite is better and faster than Parcel

  • @datawolk
    @datawolk День тому

    Nice. What about serialport in the browser next? 😀

  • @suelingsusu1339
    @suelingsusu1339 2 дні тому

    👏👏👏🙏🙏🙏👌👌👌🖖🖖🖖🖖🖖🖖

  • @offgridvince
    @offgridvince 2 дні тому

    Where's my comment

  • @alexdin1565
    @alexdin1565 2 дні тому

    can we download videos from html canvas as mp4?

    • @offgridvince
      @offgridvince 2 дні тому

      Ask chat gpt

    • @alexdin1565
      @alexdin1565 2 дні тому

      @@offgridvince i want to learn not copy nd past

    • @offgridvince
      @offgridvince 2 дні тому

      @@alexdin1565 ask chat gpt for module form or as a tutorial. It is amazing!

    • @offgridvince
      @offgridvince 2 дні тому

      It will give u step-by-step instructions in many different way for different learning styles and levels

    • @offgridvince
      @offgridvince 2 дні тому

      I incorporate the big 3 google, youtube and chatgpt... lol

  • @Seacrest.
    @Seacrest. 2 дні тому

    👍👍

  • @lakshyarajdash
    @lakshyarajdash 2 дні тому

    How to save the video ?

  • @rashedulalam7754
    @rashedulalam7754 2 дні тому

  • @nanchinsunday6136
    @nanchinsunday6136 3 дні тому

    Thank you your video helped me 😂😂

  • @tjejenathina3829
    @tjejenathina3829 3 дні тому

    thanks :)

  • @aam6950
    @aam6950 3 дні тому

    Absolutely well explained!!! Thank you!

  • @kevinhartman1724
    @kevinhartman1724 3 дні тому

    where does the main.js file go?

  • @shravansingh3527
    @shravansingh3527 4 дні тому

    ❤❤it was really good

  • @carlotadias9335
    @carlotadias9335 4 дні тому

    ⛑❤💯

  • @cliftonbartholomew-buck4159
    @cliftonbartholomew-buck4159 5 днів тому

    This baffled me for a long time.... you explained it so simply and logically. Thank you for making this content.

  • @PunhwarCoding
    @PunhwarCoding 5 днів тому

    Nice video

  • @umbertopolanco4159
    @umbertopolanco4159 5 днів тому

    How can I keep adding to the same key more data? like if it was an Array that I keep pushing data to it.

  • @maibason6387
    @maibason6387 6 днів тому

    Thank you for you sharing but can this tutorial be applied for paragraph? Or only for input box?

  • @aaqidmasoodi
    @aaqidmasoodi 6 днів тому

    closed right away. (who tf uses light mode?)

  • @user-oh7to8xw3j
    @user-oh7to8xw3j 6 днів тому

    Awesome tutorial! Thanks

  • @alenachuyankova
    @alenachuyankova 6 днів тому

    You helped me a lot, thank you!

  • @aldotugasumb2366
    @aldotugasumb2366 6 днів тому

    my savior, even though it's been 2 years, but this solved my problem

  • @samsonewuru2367
    @samsonewuru2367 7 днів тому

    this was absolute

  • @MCMishaNoernir
    @MCMishaNoernir 7 днів тому

    how to make the text persist?

  • @MuizzRufai
    @MuizzRufai 7 днів тому

    What is your color theme

  • @sudip4930
    @sudip4930 8 днів тому

    amazing tutorial

  • @afrateam6241
    @afrateam6241 8 днів тому

    grab grab, it's time to start a long time video series to develop a real life project to combine all of your talents

    • @dcode-software
      @dcode-software 2 дні тому

      Yes, planning some more React content for this year.

  • @yxsh10
    @yxsh10 9 днів тому

    WHY DONT I HAVE SELECT THIS STYLE OPTION :((((((((((((((

  • @famero_xo
    @famero_xo 9 днів тому

    Great lecture! 🎉❤❤

  • @famero_xo
    @famero_xo 9 днів тому

    Wow thank so much for this lecture. It helped! 🎉❤

  • @johnvincentjimar4157
    @johnvincentjimar4157 11 днів тому

    Explanation is good but why is your vscode on light mode😵

  • @alexdin1565
    @alexdin1565 11 днів тому

    please can you make video about downloading the video from canvas even chatgpt don't give me a solution

  • @icyauk107
    @icyauk107 11 днів тому

    Explained very simply. Thank you very much, you have saved my final exams. AJAX is a lot more simple when you explain it this way, with very barebone and easy examples.

  • @ziadabdullah8255
    @ziadabdullah8255 11 днів тому

    Short but informative. Thank you!

  • @leetcoder987
    @leetcoder987 12 днів тому

    too much talking just get to the point

  • @teoh996
    @teoh996 12 днів тому

    Hello dcode. When I use computer style to get img width for an image whose src is an online link it works right. But for the same exact image, when I download it and then I use the get computed style method on that same image who’s src now is local to my pc, I get 0px. Any ideas why that is happening?

  • @afrateam6241
    @afrateam6241 13 днів тому

    You are a web Guru , may you create a video series to develop a full function clicker game without any frameworks. An online idle game to be safe, secure , and scalable . Just like "not coin" , "tapswap" and "hamster kombat"

    • @dcode-software
      @dcode-software 2 дні тому

      Hey, thank you. I'll take it on board 👍

  • @douglascounts4634
    @douglascounts4634 13 днів тому

    Dom, I love your stuff and have watched you for years. You are my favorite "go to" person for learning. So I want to see your channel grow but you still don't use an intro, or a phrase that you use in every video, etc. These are branding necessities that help people recognize and remember your channel and what you have to offer. You should also plant the seed to "like and subscribe" earlier in the video, so as people watch your video, they have that to ponder upon instead of thinking of your "like and subscribe" message more as ending movie credits and exit language just before the next video is shown. I don't want to sound harsh, but some of the very best talent on UA-cam doesn't grow in viewership simply because they don't take branding into account. I wish great content was enough to grow a channel, but without branding, it sadly isn't as every channel is now competitive. People want the content, I love your content and think it is the best, but without branding, people simply will not remember you or how to find you on UA-cam. Even a subscriber can lose your channel among the other hundreds of channels they are subscribed to. You are such a big enough part of my life now that I don't want to see your channel disappear because you didn't do any branding. I think adding an intro, and integrating a short repeated phrase or jingle to every new video would grow your channel exponentially. Your work is greatly appreciated and your audience loves you man....

    • @dcode-software
      @dcode-software 2 дні тому

      I truly appreciate it mate thank you. I understand where you're coming from, branding is a pretty detailed subject and I'm sure there are ways which I can improve it without it being disturbing to the viewer. I'll take your feedback on 🤞and we'll see how it goes!

  • @McKinneyy
    @McKinneyy 13 днів тому

    hey! i know this is pretty old now but I'm trying to implement this, and i'm getting an error saying that confirm is not defined. I even get this error when i download your code from codepen and use it as it is there. It works fine in codepen but not in webstorm when I put it in there - is there something weird with webstorm that would cause this issue?

  • @lounes03b99
    @lounes03b99 14 днів тому

    Do u have some projects for React beginners?? How to master react??

    • @dcode-software
      @dcode-software 14 днів тому

      Not yet. My channel has been mainly focused on web development without frameworks/libraries but I'm considering uploading React & TypeScript videos this year.

    • @lounes03b99
      @lounes03b99 14 днів тому

      @@dcode-software ok, hope u success 🔥 🔥

  • @anamarie9585
    @anamarie9585 14 днів тому

    hello, i have project to apply loading spinner in my project but strictly using css, html and sass only no javascript ... please help me how because i see all the video is needed to use jS

    • @dcode-software
      @dcode-software 14 днів тому

      Hi Ana, thanks for becoming a member! I've got a handful of videos on CSS-only loading spinners and animations, just search "dcode CSS loading spinner" on UA-cam. I think this one might be something that you're after: ua-cam.com/video/-HS9IIuT_Mo/v-deo.html

    • @anamarie9585
      @anamarie9585 14 днів тому

      @@dcode-software thank you

  • @isabelphillips451
    @isabelphillips451 14 днів тому

    This is awesome ... now I'm beginning to think you read my mind on what I plan to research on