DanCanCode
DanCanCode
  • 11
  • 189 187
TypeScript Objects and Interfaces | TypeScript Tutorial
In this TypeScript tutorial video I cover defining types for objects. Structured data of key-value pairs is incredibly common, and TS helps us with preventing errors, typos, and exploring with code completion. I cover the type and interface keywords as well as the typeof operator to help with narrowing data types when required. Let me know what you think in the comments below.
Learn TypeScript Playlist: ua-cam.com/play/PLZ0S1zTntqakeRerVbKHCIXxegmA-3fpj.html
Matt Pocock's video
TypeScript: Should you use Types or Interfaces?
ua-cam.com/video/zM9UPcIyyhQ/v-deo.html
You can also find me on:
Twitch: www.twitch.tv/DanCanCode
Twitter: DanCanCode
Rugged Software
Business contact: www.ruggedsoftware.dev/
00:00 Intro
00:08 Typing Objects
01:00 Code Completion
01:30 Explore an API
02:22 Nested Objects in Types
02:48 Interface and Type Keywords
04:44 Optional Properties
05:41 Narrowing Types
08:13 typeof Operator
09:21 Next video
09:51 Outro
Переглядів: 244

Відео

Basic Types and Annotations | Learn TypeScript Tutorial
Переглядів 312Рік тому
I explain what type annotations are and introduce several basic data types such as strings, numbers, and booleans. Building on this, I cover parameter types, return types, and function types. Plus, a few other bits of information here and there. Hope you find it useful! You can also find me on: Twitch: www.twitch.tv/DanCanCode Twitter: DanCanCode 00:00 Intro 00:14 Basic Types 02:57 ...
Beginner TypeScript: Setup | with no-install web playground or node.js
Переглядів 439Рік тому
If you haven't touched TypeScript yet you may be overwhelmed by all the information you hear. Join me for a series of small videos introducing the various features of TypeScript and when you may want to use them! "Show the lock before the key." In this video, I demonstrate two ways to get started typing TypeScript code. 1) No installation: in the browser at www.typescriptlang.org/play 2) With N...
My Favorite Way To Handle Dev Environments | VS Code Devcontainers
Переглядів 131 тис.Рік тому
A step-by-step walkthrough of using my favorite method to manage development environments: VS Code Devcontainers. No docker commands required! This is great for onboarding new people to your complex project or reproducing your work environment on a new machine. You can even use your devcontainers on the web through GitHub Codespaces. Let me know what you think in the comments. I spend several m...
Add Tailwind CSS to ANY Project
Переглядів 1,5 тис.Рік тому
I love the simplicity and speed of using Tailwind CSS for most styling in my projects. When I need a custom solution, I can always craft custom CSS classes. Some projects have more complicated configurations and build steps than others, and in this video, I share how I use Tailwind's CLI to use it in any project. You can also find me on: Twitch: www.twitch.tv/DanCanCode Twitter: Dan...
Check out Zod 3.20 - Data Validation for TypeScript
Переглядів 844Рік тому
Zod is a fantastic data validation library for JavaScript and TypeScript I have used for a while. It released some new capabilities in 3.20, so I am checking them out. Zod on GitHub: github.com/colinhacks/zod You can also find me on: Twitch: www.twitch.tv/DanCanCode Twitter: DanCanCode
Create and Deploy a Website with REACT and VITE in under 10 minutes
Переглядів 55 тис.Рік тому
If you have a website or app you'd like to make you can very quickly create a prototype with React and Vite. These single-page apps (SPAs) are easy to deploy (think drag and drop) on hosts like Netlify, often for FREE! With HTTPS encryption! This is about as simple as it gets if you want something interactive. I also included a short section on adding unit testing to your app with Vitest, becau...
Add Users To Your Cloud Development Server
Переглядів 338Рік тому
When working with other developers on a project it is often challenging to make sure you're working with the same tools. The infamous "but it works on my machine". In this video, I show one way to address this problem by creating a cloud development server where you can share resources and work with the same tools while keeping separate workspaces. You can also find me on: Twitch: www.twitch.tv...
Python Basics - Working with Strings and Text #LearnToCode
Переглядів 284 роки тому
Learn how to manipulate text in Python. Use the power of words! Write data in multiple languages! Wield the authority granted by emoji! ⚔🛡 Check out the written version: moderncoder.io/tutorials/python-basics-strings/ You can also find me here @DanCanDoTV: Twitter: bit.ly/2bFrvtA Twitch: bit.ly/DanCanDoTV
Python Basics Tutorial - Numbers and Functions
Переглядів 374 роки тому
Discover the first steps in writing Python code. I introduce using numbers and functions, interacting with the interpreter through the Jupyter Notebook, and how to get help. Written Tutorial: moderncoder.io/tutorials/python-basics-numbers-and-functions/ Notebook version on GitHub: bit.ly/2Vwvn9U You can also find me here @DanCanDoTV: Twitter: bit.ly/2bFrvtA Twitch: bit.ly/DanCanDoTV
Getting Started with Python - Download and Install
Переглядів 1084 роки тому
The first step to learning programming with Python is getting it on your machine! Let's download and install the easy way with Anaconda. Then we'll pick a code editor so you can see that sweet syntax coloring candy. I talk about Spyder, Jupyter Notebooks, VS Code, and PyCharm Community Edition. See the written tutorial at moderncoder.io/tutorials/getting-started-with-python/ You can also find m...

КОМЕНТАРІ

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

    Great video❤...

  • @SofianMW
    @SofianMW 17 днів тому

    Awesome!!! Thanks much!!!

  • @shivakalash1170
    @shivakalash1170 20 днів тому

    Wrong video title 😅,u didn't actually create any website

  • @alexandreredon2887
    @alexandreredon2887 26 днів тому

    When did you setup node lol, i just read « node -version »

  • @anfedoro
    @anfedoro Місяць тому

    whatever I am trying to do in acordance to this video, which leave an imression that there shouldnt be any obstacles I ALWAYS gettgin same result trying to open the repo in dev container Error: unable to get issuer certificate at TLSSocket.onConnectSecure (node:_tls_wrap:1674:34) at TLSSocket.emit (node:events:519:28) at TLSSocket._finishInit (node:_tls_wrap:1085:8) at ssl.onhandshakedone (node:_tls_wrap:871:12) all my attemts with various ways, with variuous recomendations I found in internet end up with the same annoyng result!!. Is there anybody who may clearly explain what is happening and why.. otherwise I here only some guesses - try thi.. try that.. which looks like some shaman manilulations with no celar reasoning.

  • @waleedmonim2372
    @waleedmonim2372 Місяць тому

    So the dist folder contains all our project files?

  • @fromnsk
    @fromnsk 2 місяці тому

    Cool stuff, thanks! But ChatGPT says the following about "Dev Containers: Open Folder in Container": When you use "Dev Containers: Open Folder in Container", VS Code is actually working directly inside the container's environment. This means: No Cross-Environment File Sync: You’re not syncing files between Windows and Linux; instead, you’re directly editing files in the Linux environment of the container. Performance: Since everything happens within the container, performance should not be significantly impacted. There's no constant file transfer between Windows and Linux because the file system you're working with is entirely inside the container.

  • @amiesanyang
    @amiesanyang 2 місяці тому

    Nice tutorial but we did not create a website. we only deployed the vite sample page. But it does contain some other useful information.

  • @devendrahaldankar8535
    @devendrahaldankar8535 2 місяці тому

    Subscribed! The simplicity in presentation, easy going nature, I loved most!

  • @xaas
    @xaas 3 місяці тому

    30 minutes should've been 5 without all the water... don't waste my time please

  • @paulwozere
    @paulwozere 3 місяці тому

    These instructions no longer work. When I do the Clone it just asks me for the branch and then does nothing

  • @mahsaamiri9243
    @mahsaamiri9243 4 місяці тому

    You explained it in an awesome way! Thanks

  • @exciteresearch
    @exciteresearch 4 місяці тому

    Hey Dan and Dan's community, I've been testing VSCode and Devcontainers in WSL/Docker for the last four days but I'm having a problem with "Build repository in devcontainer" using a Bitbucket Repository which hangs in the terminal when requesting permission to add the Bitbucket server to known_hosts. It just hangs and doesn't take the 'yes' keystrokes for input. Does anyone else have a solution?

  • @davidhughes3834
    @davidhughes3834 5 місяців тому

    Nice :) +1 sub

  • @joellozano-TurboMarketing
    @joellozano-TurboMarketing 5 місяців тому

    Hola, como hariamos esto dentro de un contenedor? como crear la imagen para desarrollar dentro del contenedor WSL?

  • @Adhocfan
    @Adhocfan 5 місяців тому

    great video. How would you do this for a nx monorepo that has 2 apps in side it with libs?

  • @Lofausto66
    @Lofausto66 5 місяців тому

    Thanks man, great video! It saved me so much time

  • @vitcosoft
    @vitcosoft 6 місяців тому

    Very helpful, thanks!

  • @CryptoBuilders
    @CryptoBuilders 6 місяців тому

    Hey dan, if i configured already WSL2 and Ubunto on my widnows OS, wouldnt be better to install directly docker desktop for linux instead of windows version?

  • @slowjocrow6451
    @slowjocrow6451 6 місяців тому

    Finally I understand why and how to use this stuff 😅

  • @OfoeNelson
    @OfoeNelson 7 місяців тому

    Great video Dan but can you stop jump cutting whiles editing video that displays code because if someone is coding along they might miss just one step buried in the code somewhere and will wonder why they're code is breaking. I encourage you to only cut the video after you've typed the code in full don't cut to a fully typed line of code. Thanks and keep up the great work!

  • @alephzero7808
    @alephzero7808 7 місяців тому

    404 error 😢

  • @JamesQQuick
    @JamesQQuick 7 місяців тому

    Wow, I didn't know about this. Really cool!

  • @Azeemhassan-i2k
    @Azeemhassan-i2k 8 місяців тому

    i search all over the youtube there is no one tell the solution how we will manage "nodemon" with devcontainer, not just nodemon but same next.js, vue.js, laravel vite.

  • @mycg-09
    @mycg-09 8 місяців тому

    Thank you for introducing Vitest to me and at this stage. My teachers keep telling me testing is so important but most tutorials don't introduce this at the beginner level.

  • @Malix_Labs
    @Malix_Labs 8 місяців тому

    Perfect amount of edge-case covered, goated tutorial

  • @jimmydfgh8805
    @jimmydfgh8805 8 місяців тому

    I am trying to build an image using docker and the dockerfile is in the directory. docker extension is already installed. But when I build, the command line says "bash: docker: command not found". I don't know whether it is an image problem, sometimes I don't have the issue and sometimes I do. Any suggestions?

    • @jimmydfgh8805
      @jimmydfgh8805 8 місяців тому

      Ah, I just discovered that Docker is not installed by default in the image and I need to install myself. And the docker extension is a different thing altogether. Thank you.

  • @wattsfield1889
    @wattsfield1889 9 місяців тому

    Cool! I am totally looking deeper into Dev Containers to avoid installations pain for our team

  • @iotbits
    @iotbits 9 місяців тому

    Great tutorial, you explained all the steps, mostly tutors or experienced people assume the viewer knows some steps which is not always true, I appreciate your extra efforts explaining each step thoroughly. Thanks.

  • @kenchang3456
    @kenchang3456 9 місяців тому

    Way excellent video, thanks. I'm going to give it a try.

  • @clusterdriven
    @clusterdriven 9 місяців тому

    @DanCanCode, let's say you are in a devcontainer, you do some work, run git add, commit, and push. Now you realize your ssh keys are missing inside the container as they only exist in your local machine and thus you can't push code. How would you go around this issue?

  • @Daniel_Msangi
    @Daniel_Msangi 10 місяців тому

    I was stuck for hours at the build process,😢 and your tutorial made me realize the bug for my app is to cd into the right directory file. Thanks man!

  • @RajinderYadav
    @RajinderYadav 10 місяців тому

    This is stupid to copy files into a devcontainer? with docker you can just mount the volume into the container of the local host system. So basically devcontainer is for people too lazy to learn a few basic docker commands? ewwwe so I have to now put a dockerfile into a vscode type json file? 😂 ...oh ya much easier. Now some clown developer needs to read both dockerfile and devcontainer json file manuals and other configurations info when you get past some simple hello world setup.

  • @DavidSuárez-y2s
    @DavidSuárez-y2s 10 місяців тому

    I prefer to create my own Docker Compose with bind mounts to my repo code, and then use the VSCode's "attach to running container" functionality. Way easier, and without boiler plate. In this video they explain how easy it is to attach: ua-cam.com/video/8gUtN5j4QnY/v-deo.html&ab_channel=Code2020

  • @makoswebdev7382
    @makoswebdev7382 10 місяців тому

    Dan, your video was a lifesaver! I spent the entire day wrestling with the slow system problem you've mentioned , only to discover through your tutorial that the root of my troubles was cloning the repo into my local Windows file system. Your guidance was invaluable - thank you once more.

  • @VitorBonelli
    @VitorBonelli 10 місяців тому

    Perfect tutorial! Learned even more than what i was looking for hehe

  • @samlewis1433
    @samlewis1433 10 місяців тому

    this is very good video but my brain cant handle this so im goona watch it again

  • @rishabhsaxena9357
    @rishabhsaxena9357 11 місяців тому

    Nice video!! I've some questions: 1. How to share the dev container to a co-worker? 2. If I add PostgreSQL as a database in my dev container, how will I access it using softwares like PgAdmin/Dbeaver? 3. If I have my backend running on my local windows machine serving some APIs and my angular frontend application running in dev container, how will frontend communicate to the backend?

  • @utkarshkukreti239
    @utkarshkukreti239 11 місяців тому

    Fantastic

  • @manee427
    @manee427 11 місяців тому

    How did you opened your terminal in windows with shortcut?

  • @samuelkinyua8214
    @samuelkinyua8214 Рік тому

    is the manual deploy the only way to deploy a Reactjs app created with vite ? please help

  • @mykola2173
    @mykola2173 Рік тому

    This is magic! Exactly what I needed, thank you!

  • @akshanshkaushal9422
    @akshanshkaushal9422 Рік тому

    getting 404 error

  • @JeanPhilippeMaquestiaux
    @JeanPhilippeMaquestiaux Рік тому

    Sometimes later... How do you specify the volume location e.g. /home/dev/projects/proj1

  • @53Strat
    @53Strat Рік тому

    Which theme are you using?

  • @breezewang6344
    @breezewang6344 Рік тому

    Thanks for this great video. May I know which extension you used to draw flow-chart at around 7:00 minute?

    • @soorbus
      @soorbus 2 місяці тому

      If you look right at the top of his screen, looks like he is using excalidraw

  • @johansapulete
    @johansapulete Рік тому

    wtf, they ask my id number only for sign up are they f kidding me

  • @markortiz2679
    @markortiz2679 Рік тому

    @DanCanCode, what happen if we need most updated version of java for example but the available base workspace is still using an old version, is there a way to tell devcontainer to use latest or different version of java? Thanks

  • @rujor
    @rujor Рік тому

    Very nice walkthrough! It would be very useful to know how to setup container access to localhost, in cases where dev-servers (SQL/Redis etc.) are running there.

  • @Codexbits
    @Codexbits Рік тому

    Learned alot from setting up the json file! I added tailwind to my project before I thought by just basically installing it with npm and adding to the global css.. im going to try it this way! Didnt even know all that was going on lol. Thanks for making!