Code With Hooria
Code With Hooria
  • 41
  • 8 516
How to CREATE a PERSONAL PORTFOLIO Website Using HTML and CSS
How to Create a Personal Portfolio Website Using HTML and CSS | Easy Tutorial
----------------------------------------------------------
Learn how to build a personal portfolio website using HTML and CSS in this beginner-friendly tutorial! This video will guide you step by step to design a responsive and stylish portfolio to showcase your projects and skills.
What You’ll Learn:
• How to create the structure of a portfolio website with HTML.
• How to design and style your portfolio using CSS.
• Tips for making your portfolio responsive for all devices.
This tutorial is perfect for beginners and anyone who wants to create a responsive personal portfolio website using HTML and CSS only.
-----------------------------------------------------------
Don’t forget to like, comment, and subscribe for more web development tutorials
-------------------------------------------------------------
FOLLOW ME ON INSTAGRAM:
codewithhooria
-------------------------------------------------------------
SUBSCRIBE, LIKE, COMMENT, AND SHARE 💜
Переглядів: 37

Відео

3D IMAGE SLIDER Using HTML, CSS, and JavaScript | Easy Tutorial with Source Code
Переглядів 3614 годин тому
3D IMAGE SLIDER Using HTML, CSS, and JavaScript | Easy Tutorial with Source Code Learn how to create a responsive and animated image slider using HTML, CSS, and JavaScript in this step-by-step tutorial. Perfect for beginners, this video will teach you: • How to make an image slider for your website. • Adding autoplay and animation effects to your slider. • Creating buttons for manual navigation...
How to Use GitHub Copilot in VS Code | Easy Tutorial | MASTER GITHUB COPILOT
Переглядів 119День тому
How to Use GitHub Copilot in VS Code | Easy Tutorial | MASTER GITHUB COPILOT Learn how to use GitHub Copilot in VS Code with this easy step-by-step tutorial! In this video, I’ll show you: • How to set up GitHub Copilot in Visual Studio Code. • Tips to make the most of this AI coding assistant. • How GitHub Copilot helps you code faster and smarter. Perfect for beginners and anyone who wants to ...
Build a Login and Registration Form with HTML, CSS, and JavaScript in 2024!
Переглядів 402День тому
Build a Website with Login and Registration | HTML, CSS, and JavaScript Full Tutorial Learn how to create a website with a login and register form using HTML, CSS, and JavaScript in this step-by-step tutorial. Perfect for beginners, this video will show you: ^ How to make a website with a login system. ^ How to create a website login page with a password. ^ How to design a login and registratio...
How to Add GOOGLE FONTS in HTML and CSS | Easy Step-by-Step Tutorial
Переглядів 8914 днів тому
How to Add GOOGLE FONTS in HTML and CSS | Easy Step-by-Step Tutorial In this video, I’ll show you how to add Google Fonts to your HTML and CSS step by step. You’ll learn two easy methods: Adding Google Fonts using the (link) tag in your HTML file. Using the @import method directly in your CSS file. By the end of this tutorial, you’ll know the pros and cons of each method and how to choose the b...
Build a STUNNING To Do List App with HTML, CSS, JavaScript in 2024!
Переглядів 25514 днів тому
Build a STUNNING To Do List App with HTML, CSS, JavaScript in 2024! | Create a Stunning To-Do List App with Modern Design (HTML, CSS, JavaScript) Learn how to create a stylish and responsive To-Do List App using HTML, CSS, and JavaScript. In this video, you’ll learn how to design beautiful frosted-glass product cards with glassmorphism effects and add dynamic features like marking tasks as comp...
CREATE Your Own CALCULATOR with HTML, CSS and JAVASCRIPT!
Переглядів 18421 день тому
CREATE Your Own CALCULATOR with HTML, CSS and JAVASCRIPT! | Glassmorphism Calculator in Dark Theme | HTML, CSS, and JavaScript Tutorial Learn how to create a beautiful glassmorphism calculator with a modern dark theme using HTML, CSS, and JavaScript. This step-by-step tutorial shows how to design an attractive calculator with sleek effects and interactive buttons. Perfect for beginners and web ...
How to make login form in html and css | CSS login form | Make login page in easy way
Переглядів 67521 день тому
How to make login form in html and css | CSS login form | Make login page in easy way WHAT YOU'LL LEARN: In this video, you'll learn how to create a simple and stylish login form using just HTML and CSS. Perfect for beginners, this tutorial will guide you through every step, so you can build your own responsive login form. TOPICS COVERED: • Setting up the structure with HTML • Styling the login...
MASTER CSS Transitions in 2024 and Take Your Website to Next Level!
Переглядів 62121 день тому
MASTER CSS Transitions in 2024 and Take Your Website to Next Level! | CSS Transitions Made Easy: Add Smooth Animations to Your Website | CSS Transitions Explained: Add Smooth Effects to Your Website TIMESTAMPS: 00:00 - Intro 00:54 - What Are CSS Transitions? 02:37 - Basic Syntax 03:46 - Timing Functions 04:11 - Transitioning Multiple Properties 04:47 - Exercises for Practice 04:58 - Why Use CSS...
Create Responsive Image Gallery in 5 Minutes
Переглядів 129Місяць тому
Create a Stunning Responsive Image Gallery with HTML & CSS | You Won't Believe How Easy It Is to Create a Responsive Image Gallery! | Create Responsive Image Gallery in 5 Minutes Learn how to create a responsive image gallery using HTML and CSS in this beginner-friendly tutorial. This video covers step-by-step instructions to design an attractive image gallery that works perfectly on all device...
Create a PROFESSIONAL Dropdown Menu in 5 Minutes with HTML!
Переглядів 276Місяць тому
The Shocking Truth About Dropdown Menus Nobody Knows | How to make DROPDOWN MENU using HTML And CSS | Simple Dropdown Menu HTML CSS | How to make dropdown in html | How to make dropdown menu in html and css | How to create dropdown menu in html and css | How to create transparent drop down navigation menu with css and html | How to Make a Beautiful Dropdown Menu Using HTML & CSS - Step-by-Step ...
Pure CSS Parallax Scrolling Effect in 5 MINUTES!
Переглядів 1 тис.Місяць тому
Pure CSS Parallax Scrolling Effect Made Easy | 3 CSS Parallax Mistakes That Are Costing You THOUSANDS! | Pure CSS Parallax Scrolling Effect in 5 MINUTES! | 3 Simple Parallax Scrolling Tricks to instantly Improve Your Website Learn how to create a smooth and responsive parallax scrolling effect using just CSS. This video covers step-by-step guidance to add depth to your website with fixed backgr...
STOP Making Dull Text! Learn Amazing Glow Effects Today!
Переглядів 98Місяць тому
Learn how to create stunning neon text effects using HTML and CSS in this step-by-step tutorial! Learn how to add glowing text to your website and make it stand out with a modern design. Perfect for beginners and web developers looking to enhance their projects. In this video, you'll learn: 1. How to style text with a neon glow effect. 2. The power of text-shadow and CSS animations. 3. Tips to ...
Top Web Developer Reveals Best Animated Loading Screen Techniques
Переглядів 139Місяць тому
In this video, I’ll show you how to make an animated loading screen using just CSS. Adding a loading screen to your website can make it look polished and keep users engaged. This step-by-step guide is great for beginners-just some simple CSS. Follow along to give your site a unique touch with this cool loading animation! How to make a Loader in HTML & CSS | Website Loading Animation
MIND-BLOWING CSS Secrets to Create a Custom Scrollbar!
Переглядів 263Місяць тому
MIND-BLOWING CSS Secrets to Create a Custom Scrollbar! In this tutorial, learn how to create a custom scrollbar using CSS in just 3 minutes! I'll show you step-by-step how to style a scrollbar for a unique and engaging look on your website. Whether you're looking to enhance your site's aesthetics or just want to learn CSS scrollbar customization, this video covers it all. Perfect for web design...
Create a STUNNING Glassmorphism Effect in 3 mins with ONLY HTML & CSS
Переглядів 4252 місяці тому
Create a STUNNING Glassmorphism Effect in 3 mins with ONLY HTML & CSS
The 5-Minute CSS Star Rating System Challenge
Переглядів 6432 місяці тому
The 5-Minute CSS Star Rating System Challenge
Get Smooth Button Transition with THIS HTML & CSS Trick!
Переглядів 592 місяці тому
Get Smooth Button Transition with THIS HTML & CSS Trick!
I Created a STUNNING CSS Spinning Loader in Minutes
Переглядів 1122 місяці тому
I Created a STUNNING CSS Spinning Loader in Minutes
VSCode Extensions WARZONE 2024 Top Picks to BOOST Productivity!
Переглядів 1,2 тис.3 місяці тому
VSCode Extensions WARZONE 2024 Top Picks to BOOST Productivity!
How to Add Media Queries for Responsive Web Design | CSS Media Query Tutorial
Переглядів 303 місяці тому
How to Add Media Queries for Responsive Web Design | CSS Media Query Tutorial
How to Customize Visual Studio Code | Themes, Plugins, and Terminal Tips
Переглядів 1073 місяці тому
How to Customize Visual Studio Code | Themes, Plugins, and Terminal Tips
CSS Experts Reveal Pro Tips You Never Knew Existed
Переглядів 344 місяці тому
CSS Experts Reveal Pro Tips You Never Knew Existed
Learn CSS Border Animations in Just 4 Minutes | Glowing & Spinning Effects
Переглядів 1314 місяці тому
Learn CSS Border Animations in Just 4 Minutes | Glowing & Spinning Effects
Learn CSS Animation in just 9 Minutes | Step-by-step guide
Переглядів 684 місяці тому
Learn CSS Animation in just 9 Minutes | Step-by-step guide
Create a Responsive Navigation Bar (Menu bar) Using HTML, CSS, and JavaScript
Переглядів 494 місяці тому
Create a Responsive Navigation Bar (Menu bar) Using HTML, CSS, and JavaScript
9 Minutes to DARK MODE Mastery!
Переглядів 1044 місяці тому
9 Minutes to DARK MODE Mastery!

КОМЕНТАРІ

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

    As a beginner How do u display the webpage on the left side, for me i had to open browser

    • @codewithhooria
      @codewithhooria 19 годин тому

      I use an extension called 'Live Preview' in VS Code. It lets me see the live preview of my webpage on the side without needing to open a browser. You can install it from the extensions tab, it’s super helpful for beginners! 😊

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

    Vote for JavaScript long video 😅

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

      Thanks for the suggestion 😅! A JavaScript long video sounds like a great idea.

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

    Keep posting. Just subscribed. Share a copy of codes also if possible. Thank you

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

      Thank you so much for subscribing! I’ll try to share the code in future videos 😊.

  • @EM-jo9zx
    @EM-jo9zx 10 днів тому

    مشاء الله حقيقي مبهر 👏

  • @bkp6637
    @bkp6637 16 днів тому

    Awesome.. Very good video for a beginner like me...

    • @codewithhooria
      @codewithhooria 16 днів тому

      Thank you so much

    • @bkp6637
      @bkp6637 16 днів тому

      ​@@codewithhooriaBy the way, Where are you from ?

  • @Studentsdev
    @Studentsdev 18 днів тому

  • @vibes-hj4go
    @vibes-hj4go 19 днів тому

    Nice❤

  • @khaledMohamed-tp4wx
    @khaledMohamed-tp4wx 19 днів тому

    Nice design. However don't use eval() in real projects. It's a security risk.

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

    Please a video on it😊

  • @Coder3246
    @Coder3246 21 день тому

    GG

  • @Studentsdev
    @Studentsdev 22 дні тому

    Assalamualaikum I love your videos Love from Pakistan

  • @DBP_Heaven
    @DBP_Heaven 23 дні тому

    Amazing Video for Learner But I think you should provide font link in description as it can be useful I created the same Form and learned a lot from it Thanks...

    • @codewithhooria
      @codewithhooria 23 дні тому

      Thanks a lot! I’ll add the font link to the description soon.

  • @vibes-hj4go
    @vibes-hj4go 23 дні тому

    Great ........keep it up..

    • @codewithhooria
      @codewithhooria 23 дні тому

      Thanks 😃

    • @vibes-hj4go
      @vibes-hj4go 23 дні тому

      @codewithhooria mere vs mn hr br html m right click kr k Live server pr click krna prta ha phr refresh hota ha..ye ksy hal hoga?

    • @vibes-hj4go
      @vibes-hj4go 23 дні тому

      @codewithhooria plz ans mam

    • @codewithhooria
      @codewithhooria 23 дні тому

      @@vibes-hj4go You can use the 'Auto Save' option in VS Code. Go to File > Auto Save, and it will refresh automatically when you save changes.

    • @vibes-hj4go
      @vibes-hj4go 22 дні тому

      @@codewithhooria auto save option nai hora mam error ajata ha

  • @SADAAM.
    @SADAAM. 23 дні тому

    It's beautiful vedio please keep going❤❤❤❤❤❤

  • @srikarreddychinthareddy1652
    @srikarreddychinthareddy1652 23 дні тому

    Theme and font ??

    • @codewithhooria
      @codewithhooria 23 дні тому

      The font is the default one in VS Code, and the theme I'm using is Dracula.

  • @HadiVibes-m5p
    @HadiVibes-m5p 24 дні тому

    I think aagr ap urdu ma wxplain kryn to sb k liya easy ho jyga.. good explanation..

  • @Nameless_Bot
    @Nameless_Bot 25 днів тому

    Amazing explanation, and to be honest I really understand everything, please make more videos about html and css

    • @codewithhooria
      @codewithhooria 25 днів тому

      Thank you so much! I'm really glad it helped 😊. I'll definitely make more HTML and CSS videos.

  • @FarazArbaz
    @FarazArbaz 25 днів тому

    Good

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

    GG

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

    Thank you very much for the tutorial ❤

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

    Thank you. Could you make that effect where the background moves in a different ratio than the overlay?

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

      You're welcome! That’s a great idea! I’ll try to make a video on it soon 😊.

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

    Very nice! Bravo!!

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

    GREAT

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

    WOW

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

    GG

  • @sibte.55
    @sibte.55 2 місяці тому

    wow hellooooo

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

    Please explain each and every component.if that possible we can understand content and your channel will grow

  • @OsmanSaifi-gj7rf
    @OsmanSaifi-gj7rf 2 місяці тому

    Apka insta 🎉

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

    Good thank you 🤗

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

    It just a request , can you create a portfolio website video , and i have a doubt can we see how many people actually cloned our project form github ? , and when we private our repository can any one cloned then and after we private the repository can we host it ? so many questions 🥲🥲🥲🥲🥲🥲

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

    i Downloaded bracket pair thank you once again 😊😊😊😊

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

    I downloaded css peek , project manager and the dracula theme Help full video 😊😊

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

    Which theme is this?

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

      This is the Dracula theme! It's one of my favorites 😊.

  • @codewithshyam-w1s
    @codewithshyam-w1s 3 місяці тому

    which screen recorder did you use ..?

  • @codewithshyam-w1s
    @codewithshyam-w1s 3 місяці тому

    Awesome one hooriya!!

  • @codewithshyam-w1s
    @codewithshyam-w1s 3 місяці тому

    You earned my subscribe and respect and thanks for sharing this info code with hooria :d !!

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

      Wow, thank you so much for the support! I really appreciate it 😊

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

    Great Video Hooria these are some useful and unique extensions keep making these types of videos ❤

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

      Thank you so much! I'm really glad you found them helpful 😊. I'll definitely keep making more!

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

    Bearded Theme 🗿

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

    Plugin

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

    Best 🔥

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

    in tailwind please

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

      Thank you for the suggestion! I'll try it in Tailwind next time 😊

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

    Appreciated 🫶🏻

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

      Thank you so much! I really appreciate your support 😊