Code with Surabhi
Code with Surabhi
  • 194
  • 105 203
How to install Tailwind CSS in Angular 18 - Step-by-Step Tutorial for Beginners 🚀
"🚀 Ready to supercharge your Angular 18 project with Tailwind CSS? In this quick tutorial, I’ll walk you through the entire process of installing and configuring Tailwind CSS step-by-step. Perfect for building beautiful, responsive UIs faster than ever!
🔧 What You’ll Learn:
Installing Tailwind CSS with npm
Configuring Tailwind with Angular
Updating global styles
Verifying your setup
💡 Tailwind CSS is a game-changer for modern web development. Let's make your Angular 18 project shine!
🔗 Helpful Links:
Tailwind CSS Documentation: tailwindcss.com/docs
Angular Official Site: angular.io/
✨ Don’t forget to Like, Comment, and Subscribe for more UI and Angular tips!"
#Angular18 #TailwindCSS #FrontendDevelopment #WebDesign #CSSFrameworks #ResponsiveDesign #UIUX #WebDevelopmentTutorial #JavaScript #LearnAngular
#webdesign
#html
#webdevelopment
#coding
#programming
#frontenddevelopment
#webdevelopmenttutorial
#css
#responsivedesign
#codenewbie
#uiux
#codetutorial
#designtohtml
#learntocode2024
#webdesigntutorial
#techtalk
#digitaldesign
#creativecoding
#developercommunity
#websitedevelopment
มุมมอง: 32

วีดีโอ

How to create a Responsive Portfolio Website with Angular 18, SCSS, and HTML! 🌐✨
มุมมอง 30116 ชั่วโมงที่ผ่านมา
Want to make a portfolio that looks stunning on any device? In this tutorial, I'll show you step-by-step how to create a fully responsive portfolio website using Angular 18, SCSS, and HTML. We’ll dive into responsive design techniques, leveraging Angular components, and adding custom SCSS styling to create a polished, professional website. Whether you're looking to showcase your projects or lea...
How to Create a Custom Not found Page in Angular 18 & Lottie Animation | HTML & SCSS Tutorial
มุมมอง 18วันที่ผ่านมา
In this tutorial, we'll walk you through how to create a custom 404 "Not Found" page in Angular 18. Learn how to set up Angular routing to handle unmatched URLs and design a beautiful error page using HTML and SCSS. Whether you're building a personal portfolio or a complex web application, this step-by-step guide will ensure your users never see a boring error page again. 🔑 What you'll learn: S...
💡 Pure HTML & CSS Toggle Button Tutorial 🎨
มุมมอง 2514 วันที่ผ่านมา
Learn how to create a sleek, functional toggle button using just HTML and CSS! 🚀 Perfect for beginners, this step-by-step guide will help you: ✔️ Understand the basics of HTML structure ✔️ Style your toggle button with CSS ✔️ Add smooth transitions for a polished look No JavaScript needed-just pure creativity and code! 💻✨ Don't forget to like 👍, subscribe 🔔, and share your amazing toggle button...
Custom Navigation Bar with HTML, CSS, and Angular 18
มุมมอง 9114 วันที่ผ่านมา
Custom Navigation Bar with HTML, CSS, and Angular 18
🌟 Build a Responsive Portfolio Website with Angular 18, SCSS, and HTML! 🌐✨
มุมมอง 26821 วันที่ผ่านมา
🌟 Build a Responsive Portfolio Website with Angular 18, SCSS, and HTML! 🌐✨
How to Create a Custom 404 Error Page in Angular 18 | HTML & SCSS Tutorial
มุมมอง 3.5K21 วันที่ผ่านมา
How to Create a Custom 404 Error Page in Angular 18 | HTML & SCSS Tutorial
Responsive Personal Portfolio with Angular 18, HTML & SCSS | Beginner Step-by-Step Guide 🌐📱
มุมมอง 2.9K28 วันที่ผ่านมา
Responsive Personal Portfolio with Angular 18, HTML & SCSS | Beginner Step-by-Step Guide 🌐📱
How to create custom skeleton loader Angular18, Html & SCSS - Beginners Tutorial
มุมมอง 2.7Kหลายเดือนก่อน
How to create custom skeleton loader Angular18, Html & SCSS - Beginners Tutorial
Build a responsive Modern Sign Up Page with Angular 18, HTML & SCSS 🎉 | Full Tutorial
มุมมอง 2.5Kหลายเดือนก่อน
Build a responsive Modern Sign Up Page with Angular 18, HTML & SCSS 🎉 | Full Tutorial
How to Create a Stunning Portfolio Website with Angular18, SCSS and HTML🌟
มุมมอง 3.6Kหลายเดือนก่อน
How to Create a Stunning Portfolio Website with Angular18, SCSS and HTML🌟
How to install Flex Layout in Angular18 | Html/SCSS/Angular18/Flex-Layout
มุมมอง 2.1Kหลายเดือนก่อน
How to install Flex Layout in Angular18 | Html/SCSS/Angular18/Flex-Layout
HTML,CSS & ANGULAR Website design -Surabhi’s Nine Nights of UI- NAVARATRI SERIES-DAY 9(Purple)
มุมมอง 3.5Kหลายเดือนก่อน
HTML,CSS & ANGULAR Website design -Surabhi’s Nine Nights of UI- NAVARATRI SERIES-DAY 9(Purple)
Personal Portfolio Website HTML|CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 8(Pink)
มุมมอง 1Kหลายเดือนก่อน
Personal Portfolio Website HTML|CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 8(Pink)
How to Create Landing Page with HTML,CSS -Surabhi’s Nine Nights of UI- NAVARATRI SERIES-DAY 7(Blue)
มุมมอง 5Kหลายเดือนก่อน
How to Create Landing Page with HTML,CSS -Surabhi’s Nine Nights of UI- NAVARATRI SERIES-DAY 7(Blue)
NIKE Branding Website with HTML & CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 6(Red)
มุมมอง 69หลายเดือนก่อน
NIKE Branding Website with HTML & CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 6(Red)
How to create Login with HTML & CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 5(White)
มุมมอง 768หลายเดือนก่อน
How to create Login with HTML & CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 5(White)
Personal Portfolio Website HTML|CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 4(Orange)
มุมมอง 1.8Kหลายเดือนก่อน
Personal Portfolio Website HTML|CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 4(Orange)
Personal PORTFOLIO SITE CSS & HTML - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 3(Gray)
มุมมอง 586หลายเดือนก่อน
Personal PORTFOLIO SITE CSS & HTML - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 3(Gray)
CSS & HTML Easy Way to Learn ANGULAR - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 2(Green)
มุมมอง 1.1Kหลายเดือนก่อน
CSS & HTML Easy Way to Learn ANGULAR - Surabhi’s Nine Nights of UI - NAVARATRI SERIES- DAY 2(Green)
Website Using Html, Angular17 & CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES - DAY 1(Yellow)
มุมมอง 47หลายเดือนก่อน
Website Using Html, Angular17 & CSS - Surabhi’s Nine Nights of UI - NAVARATRI SERIES - DAY 1(Yellow)
My process building websites from a design | HTML & CSS ANGULAR17 - BEGINNERS STEP-BY-STEP TUTORIAL
มุมมอง 492 หลายเดือนก่อน
My process building websites from a design | HTML & CSS ANGULAR17 - BEGINNERS STEP-BY-STEP TUTORIAL
Personal Portfolio Website with CSS and HTML - Angular17|HTML|CSS
มุมมอง 5K2 หลายเดือนก่อน
Personal Portfolio Website with CSS and HTML - Angular17|HTML|CSS
Best and easy way to learn HTML and CSS quickly - Beginners CSS Guide 2024 - ANGULAR 17 | HTML | CSS
มุมมอง 342 หลายเดือนก่อน
Best and easy way to learn HTML and CSS quickly - Beginners CSS Guide 2024 - ANGULAR 17 | HTML | CSS
Converting Illustrations into Reality with HTML, SCSS & Angular 17 - Beginner's CSS Tutorial.
มุมมอง 312 หลายเดือนก่อน
Converting Illustrations into Reality with HTML, SCSS & Angular 17 - Beginner's CSS Tutorial.
ANGULAR Project for Beginners - How to create a Website Using HTML, ANGULAR 18 & CSS
มุมมอง 602 หลายเดือนก่อน
ANGULAR Project for Beginners - How to create a Website Using HTML, ANGULAR 18 & CSS
How to create a Simple Website using HTML, CSS & ANGULAR17 - HTML, CSS Tutorial for Beginners
มุมมอง 702 หลายเดือนก่อน
How to create a Simple Website using HTML, CSS & ANGULAR17 - HTML, CSS Tutorial for Beginners
How to create a website using HTML, CSS and ANGULAR17 - CSS tutorial for beginners 2024.
มุมมอง 1652 หลายเดือนก่อน
How to create a website using HTML, CSS and ANGULAR17 - CSS tutorial for beginners 2024.
Create Lottie in Angular 17: Create Stunning Animations Easily: Step-by-Step Tutorial - ANGULAR17
มุมมอง 2492 หลายเดือนก่อน
Create Lottie in Angular 17: Create Stunning Animations Easily: Step-by-Step Tutorial - ANGULAR17
From Scratch: Build a Confirmation UI with Angular, HTML, and SCSS
มุมมอง 332 หลายเดือนก่อน
From Scratch: Build a Confirmation UI with Angular, HTML, and SCSS

ความคิดเห็น

  • @hamzaissa8807
    @hamzaissa8807 2 วันที่ผ่านมา

    this video was super helpful thank you for the content but avoid using this music as it made me sleep halfway through the video

    • @codewithsurabhi
      @codewithsurabhi 2 วันที่ผ่านมา

      I appreciate your feedback on the sound. I'll make the necessary adjustments in the next video.

  • @JhanCarlosMancillaMena
    @JhanCarlosMancillaMena 5 วันที่ผ่านมา

    Muy bonito, tienes el repositorio para ver el codigo?

    • @codewithsurabhi
      @codewithsurabhi 2 วันที่ผ่านมา

      Thank you so much. Will share the code soon!

  • @MindOfT1m
    @MindOfT1m 13 วันที่ผ่านมา

    👍

  • @takeiteasy-m9w
    @takeiteasy-m9w 18 วันที่ผ่านมา

    Wow 😮

  • @takeiteasy-m9w
    @takeiteasy-m9w 18 วันที่ผ่านมา

    👍

  • @takeiteasy-m9w
    @takeiteasy-m9w 18 วันที่ผ่านมา

    👏👏

  • @takeiteasy-m9w
    @takeiteasy-m9w 18 วันที่ผ่านมา

    Superb 👌🏼

  • @takeiteasy-m9w
    @takeiteasy-m9w 18 วันที่ผ่านมา

    Good one

  • @ogenerasheed9203
    @ogenerasheed9203 20 วันที่ผ่านมา

    I need a portfolio ❤

    • @codewithsurabhi
      @codewithsurabhi 19 วันที่ผ่านมา

      I'm so glad you're interested!

  • @nangialayishaqzai3326
    @nangialayishaqzai3326 21 วันที่ผ่านมา

    It was boring since I’m too curious here is first comment

    • @codewithsurabhi
      @codewithsurabhi 21 วันที่ผ่านมา

      Thank you so much for being the first to comment! 🙌 I love your curiosity-it's the best way to learn and stay engaged! Let me know if you have any questions or want to dive deeper into any topic. 😊

  • @SakthiVel-qd5qj
    @SakthiVel-qd5qj หลายเดือนก่อน

    Nice.🎉

  • @jefDev
    @jefDev หลายเดือนก่อน

    looks so good, any feedback on my recent portfolio project? short on my channel explaining my process

  • @vcgmpaajdoqwa
    @vcgmpaajdoqwa หลายเดือนก่อน

    Fantastic breakdown of Angular concepts! You make it so much easier to grasp the fundamentals, especially for those of us who are just starting out. I appreciate how you relate it back to CSS and HTML for better understanding!

    • @codewithsurabhi
      @codewithsurabhi หลายเดือนก่อน

      You're very welcome! Thank you for your support!

  • @vpalagurnaryg
    @vpalagurnaryg หลายเดือนก่อน

    This tutorial is incredibly helpful! Your step-by-step guide on creating a portfolio site makes it feel so approachable, even for beginners. I can’t wait to apply these techniques and showcase my own work!

    • @codewithsurabhi
      @codewithsurabhi หลายเดือนก่อน

      I’m so grateful for your support! Thank you!

  • @puckzvmjhlavacekj
    @puckzvmjhlavacekj หลายเดือนก่อน

    This tutorial breaks things down so well! I’m really impressed with how easy you made HTML and CSS feel, especially for a beginner like me. The design is clean and modern, and your explanations were spot on. It’s exactly the kind of tutorial I needed for my next project!

    • @codewithsurabhi
      @codewithsurabhi หลายเดือนก่อน

      Thank you so much! I truly appreciate your support!

  • @ramaswamykrishnamoorthy3357
    @ramaswamykrishnamoorthy3357 2 หลายเดือนก่อน

    I could not find app.config.ts

    • @codewithsurabhi
      @codewithsurabhi หลายเดือนก่อน

      The configuration file is located at the path 'src/app/app.config.ts'.

  • @devasyapatel2131
    @devasyapatel2131 2 หลายเดือนก่อน

    Great work source code please

    • @codewithsurabhi
      @codewithsurabhi 2 หลายเดือนก่อน

      Thank you so much for your great support! Please checkout my channel for the detailed video.

  • @Valiyavitilkochunni
    @Valiyavitilkochunni 2 หลายเดือนก่อน

    Bro give source codes 😊

  • @Franc1sJ0hn
    @Franc1sJ0hn 2 หลายเดือนก่อน

    Preview was incredible. where is the full video?

    • @codewithsurabhi
      @codewithsurabhi 2 หลายเดือนก่อน

      Thanks for your interest! The full video should be available on the channel soon. Stay tuned and make sure to subscribe so you don't miss it!

  • @mithunmohan5695
    @mithunmohan5695 2 หลายเดือนก่อน

  • @Roryanderson8408
    @Roryanderson8408 2 หลายเดือนก่อน

    Nice video

    • @codewithsurabhi
      @codewithsurabhi 2 หลายเดือนก่อน

      Thank you so much. Please subscribe to my channel.

  • @TheGirlWhoDared95
    @TheGirlWhoDared95 4 หลายเดือนก่อน

    I have dont this same for me, your css game is too good.... good Job very helpful, where can I see the code ? I have replicated it but my subcribeis not going down

    • @codewithsurabhi
      @codewithsurabhi 2 หลายเดือนก่อน

      I am planning to upload the code soon.

  • @takeiteasy-m9w
    @takeiteasy-m9w 11 หลายเดือนก่อน

    Nice 👍

  • @danetodd5311
    @danetodd5311 ปีที่แล้ว

    😣 P R O M O S M

  • @tarunparmar1723
    @tarunparmar1723 ปีที่แล้ว

    What is quirks mode?

    • @codewithsurabhi
      @codewithsurabhi ปีที่แล้ว

      "standards mode" pages are rendered according to the HTML and CSS specifications, while in "quirks mode" attempts are made to emulate the behavior of older browsers

    • @codewithsurabhi
      @codewithsurabhi ปีที่แล้ว

      For more info plz check below link developer.mozilla.org/en-US/docs/Web/HTML/Quirks_Mode_and_Standards_Mode

  • @mahdiandalib186
    @mahdiandalib186 ปีที่แล้ว

    nice, plz create more short tutorials like this, can you teach us how to create Scrollable Slider Tabs like youtube in angular?:

    • @codewithsurabhi
      @codewithsurabhi ปีที่แล้ว

      Sure. Thanks for the feedback ✌️✌️

  • @aniruddha683
    @aniruddha683 2 ปีที่แล้ว

    noo sound 😮‍💨😮‍💨😮‍💨😮‍💨

  • @Kiranvbhat
    @Kiranvbhat 2 ปีที่แล้ว

    Thank u sir

  • @simpleman1496
    @simpleman1496 2 ปีที่แล้ว

    thank you

  • @simpleman1496
    @simpleman1496 2 ปีที่แล้ว

    thank you

  • @sarangbhutto5291
    @sarangbhutto5291 2 ปีที่แล้ว

    amazing bro yours skils is outstanding

  • @lilinh9631
    @lilinh9631 3 ปีที่แล้ว

    This is not responsive at all…

    • @codewithsurabhi
      @codewithsurabhi 3 ปีที่แล้ว

      Hi, thanks for ur valuable feedback. I was busy with some other works, will do it soon.

  • @rushikeshpatil3277
    @rushikeshpatil3277 3 ปีที่แล้ว

    great mam keep upload video

  • @Hope-cx5hi
    @Hope-cx5hi 3 ปีที่แล้ว

    thats amazing i think i can do angular

    • @codewithsurabhi
      @codewithsurabhi 3 ปีที่แล้ว

      Yeah! You should. Just try ✌️

  • @onslaadhar915
    @onslaadhar915 3 ปีที่แล้ว

    source code pls

  • @ui-passion
    @ui-passion 3 ปีที่แล้ว

    good video.. charlie chaplin ki yaad aa gayi.. bus voice ki kami he

  • @WheelsOfSafarnama
    @WheelsOfSafarnama 3 ปีที่แล้ว

    Yar oo link kam.ni krrhe

  • @syedvurfanhussainy3636
    @syedvurfanhussainy3636 3 ปีที่แล้ว

    Sis Where is your voice , Video is Nice but getting lot of confusion without voice Please Update with voice if can...Thanks for Video.

    • @codewithsurabhi
      @codewithsurabhi 3 ปีที่แล้ว

      Sorry for that, nxt time will try

  • @titugeorge
    @titugeorge 3 ปีที่แล้ว

    WOW Improved

  • @samgeorge5635
    @samgeorge5635 3 ปีที่แล้ว

    Super, this really helps.

    • @codewithsurabhi
      @codewithsurabhi 3 ปีที่แล้ว

      Thank you so much for your support. Keep watching!

  • @shubhamseth9560
    @shubhamseth9560 3 ปีที่แล้ว

    Amazing skill , you did it flawlessly

    • @codewithsurabhi
      @codewithsurabhi 3 ปีที่แล้ว

      Thank you so much. Keep watching 🤩🤩

  • @titugeorge
    @titugeorge 3 ปีที่แล้ว

    Good Tutorial. The audio is too low.

    • @codewithsurabhi
      @codewithsurabhi 3 ปีที่แล้ว

      Thanks for the valuable feedback. I will try to improve the audio in the next video.