HTML CSS JavaScript projects for beginners 2024 - 12 js projects with source code

Поділитися
Вставка
  • Опубліковано 25 лис 2024

КОМЕНТАРІ • 415

  • @JavaScriptKing
    @JavaScriptKing  Рік тому +15

    Check the projects live demo and source codes here:
    www.100jsprojects.com

  • @Bobo011
    @Bobo011 Рік тому +65

    this is the 3rd projects video i finished from you, and i've learned way more from them then from watching 2 full courses, i can't ever thank you enough sir.

  • @JavaScriptKing
    @JavaScriptKing  Рік тому +45

    timestamp:
    0:00 - Intro
    1:31 - Dad Jokes Generator (Preview)
    2:55 - Dad Jokes Generator (HTML)
    14:52 - Dad Jokes Generator (CSS)
    34:24 - Dad Jokes Generator (JavaScript)
    1:05:33 - Feedback UI (Preview)
    1:07:39 - Feedback UI (HTML)
    1:23:50 - Feedback UI (CSS)
    1:46:53 - Feedback UI (JavaScript)
    2:11:26 - English Dictionary (Preview)
    2:13:10 - English Dictionary (HTML)
    2:27:58 - English Dictionary (CSS)
    2:40:54 - English Dictionary (JavaScript)
    3:21:02 - Random Quote Generator (Preview)
    3:22:17 - Random Quote Generator (HTML)
    3:38:46 - Random Quote Generator (CSS)
    3:57:47 - Random Quote Generator (JavaScript)
    4:22:57 - Anime Pics Generator (Preview)
    4:24:16 - Anime Pics Generator (HTML)
    4:37:52 - Anime Pics Generator (CSS)
    4:57:15 - Anime Pics Generator (JavaScript)
    5:25:38 - Random Emoji (Preview)
    5:26:56 - Random Emoji (HTML)
    5:35:20 - Random Emoji (CSS)
    5:49:40 - Random Emoji (JavaScript)
    6:17:04 - Temperature Converter (Preview)
    6:18:41 - Temperature Converter (CSS)
    6:34:20 - Temperature Converter (HTML)
    6:47:58 - Temperature Converter (JavaScript)
    7:08:36 - BMI Calculator (Preview)
    7:10:47 - BMI Calculator (HTML)
    7:25:51 - BMI Calculator (CSS)
    7:41:21 - BMI Calculator (JavaScript)
    8:00:08 - Note App (Preview)
    8:01:58 - Note App (HTML)
    8:12:14 - Note App (CSS)
    8:33:19 - Note App (JavaScript)
    9:19:55 - Currency Converter (Preview)
    9:21:45 - Currency Converter (HTML)
    9:38:04 - Currency Converter (CSS)
    9:52:33 - Currency Converter (JavaScript)
    10:21:56 - Loan Calculator (Preview)
    10:23:39 - Loan Calculator (HTML)
    10:38:00 - Loan Calculator (CSS)
    10:47:46 - Loan Calculator (JavaScript)
    11:03:18 - Weight Converter (Preview)
    11:04:57 - Weight Converter (HTML)
    11:18:41 - Weight Converter (CSS)
    11:35:57 - Weight Converter (JavaScript)

    • @JavaScriptKing
      @JavaScriptKing  Рік тому +2

      sure mate

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

      Sir i want to learn from you react project

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

      @@riteshgaihre6277 check my react channel @reactproject it is called react and next js projects with sahand

  • @muratdurmaz4241
    @muratdurmaz4241 Рік тому +26

    I absolutly love it . I prefer this kind of short projects instead of watching hours long videos that I lost track of it at some point. Here you never get bored. It is simply explained and easy to practice. Many many thanks....

  • @kunalchauhan5294
    @kunalchauhan5294 Рік тому +27

    your channel name is already defining you A KING!!!!

  • @thisaruwithanapathirana4885
    @thisaruwithanapathirana4885 Рік тому +3

    You have saved my time alot. I have wasted hours and money on JS courses at Udemey. You have taught everything with active projects for $0. You are a greet teacher for beginner programmers. Thanks alot

  • @tonygomez4085
    @tonygomez4085 Рік тому +10

    I love your passion, dedication and delivery to teaching other people, (which I'm assure are all strangers), and your
    knowledge. I just start learning html for the sole purpose of keeping my mind active, while learning something new at
    the same time. I will soon be reaching my 70s and over the past 20 years I have learned a LOT about Android technology
    and currently set my mind on Programming. I do not intend, under any circumstances, to monetize what I have learned because I do not have the need, but the impetus to learn has always followed me... and still continues. I have bought several courses and in just one (1) hour I have learned much more than in the months of practice that I have been doing. Thank you very much again and many, many blessings. A big hug from Puerto Rico: "La Isla Del Encanto".🙏

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

      Thanks very much for your nice comment. Appreciate it :)

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

      I am 72 and do the same as you. Keeping my mind going. I have wrote PHP and CSS for years, b8uit never learned Javascript. I make project after project on localhost and love doing it

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

      @@Knards wow, I cant imagine, this is my dream. I am 35, but I want to this till the end of my life

  • @siamakut
    @siamakut Рік тому +9

    I am an Iranian software developer, I can just say I am proud of you ❤️ you did such an awesome job, keep up the good work bro🌟 ❤️

  • @lilianamilano3707
    @lilianamilano3707 Рік тому +10

    I just finished the last project in the series

    • @JavaScriptKing
      @JavaScriptKing  Рік тому +1

      Thanks for your review and feedback on the course.

  • @biswajitmuduli7333
    @biswajitmuduli7333 Рік тому +1

    1.05.00 h , i realy compete my 1st project.i like your 1.smooth speaking,2,detailed explanation. thanks bro.

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

    I've only just started and _already_ imo this is proving to be the best taught project tutorial I've ever seen.

  • @tonytodd7011
    @tonytodd7011 Рік тому +1

    Finally found the best organized and explained tutorial? Thank you JavaScript King, I think you are the tutorial king!

  • @PeriklesPeriklesoglu
    @PeriklesPeriklesoglu Рік тому +3

    i really appreciated for your teaching style and mini-project selected by you. these are really helping me to embrace javascript programming logic.

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

    after memorizing syntax, your projects helped me put the puzzle together thank you!.

  • @TheCat-jc6yy
    @TheCat-jc6yy 11 місяців тому

    دستت درد نکنه واقعا. اموزش برنامه نویسی به این خوبی ندیده بودم آقا سهند

  • @kartikkaran9282
    @kartikkaran9282 Рік тому +1

    Very must video for beginner's learner

  • @taofeektunji5605
    @taofeektunji5605 Рік тому +1

    Hello teacher an from Nigeria
    I love programming More with the way you explain things
    I really love your teaching
    I wish i could see you one day😍

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

    You are the best. I feel so relaxed watching your videos. Most others stress me out. Such thorough explanations of literally everything you type and click are hard to find. Very much obliged for your channel.

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

    Great video! Doing a few of these really helped me get used working with HTML, CSS, and JavaScript. It was fun going off of your preview and then seeing how our approaches differed.
    I do wish the projects had more variety though. Most of the projects are styled very similarly and they're programmatically similar too.

  • @veryslon5104
    @veryslon5104 Рік тому +5

    Thanks you wonderful teacher

  • @jubersonjulesoriol1440
    @jubersonjulesoriol1440 Рік тому +6

    Hello, I really like this series of videos that you make, I would like you to do a course on 12 projects with React js for beginners using react hooks, I'm sure you would help many people

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

    what a wonderful explanation...I want more videos about javascript project...best regards

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

    i love you as a teacher mor than as a programmer thank you for your tutorial

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

    This is the best course from UA-cam for sure
    I can understand and learn very easy everything it’s slowly nice job
    Keep this uppp❤

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

    As a beginner i learned lots of things here thanks a lot

  • @GeekLab
    @GeekLab Рік тому +5

    Your explanations are so clear ❤️. Can you kindly teach about GIT HUB please? 🖤

  • @Shriram279-1
    @Shriram279-1 Рік тому

    Hi ,sahandghavidel
    thanks a lot for the efforts and content from you. I have watched and some 8 to 9 videos of yours and tried the project on my own. Iam able to do it and understood the concepts from the video. It would be really nice and helpful if you do upload the project tutorial of 100+ projects using react js, typescript and tailwind css. Lot of thanks to you once again.

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

    really like to work on all of these projects, thank you for your time ❤

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

    Shortcuts
    2:26:13
    6:31:56
    6:56:12
    8:11:21
    8:13:16
    9:35:14
    10:38:48
    10:40:38

  • @Ibrahim_webdeveloper
    @Ibrahim_webdeveloper 10 місяців тому +1

    You have no idea of how much you really help me with this projects …. I felt like crying 😭 ❤. You really make me happy 😊 I have no words to describe how much I love the effort you put for this amazing best videos❤
    Thank you sir

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

    I sincerely appreciate your informative and comprehensive job. I am profoundly driven into html& CSS by watching this series of projects. Million thanks .

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

    Wow . I am an experienced fullstack java developer . I will ask my nephew to go thru this course to get handson knowledge and apply for jobs

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

    Really u r teaching is very great...

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

    Thank you so much.. This is most latest newest js videos.. Waited so far

  • @shubhamhooda202
    @shubhamhooda202 Рік тому +1

    hello sir... your project is very helpful for beginners

  • @আরজানি
    @আরজানি Рік тому

    Wow,,sir,,your are Super.. Please give More advance video.. I am From Bangladesh.. I am learning with you codding and English.. Love you 💓

  • @Hunterjeet-pq6fv
    @Hunterjeet-pq6fv Рік тому

    one of the best tutorial.. you channel gonna ALL WAY UP ....keep it up.......

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

    you need more recognization tq u youtube for showing this amazing channel

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

    Thanks Sir HeLP FULL Video

  • @The.creativity
    @The.creativity Рік тому

    جميييييل

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

    Learned a lot from this , I am coding along with the video..! thank you for this video .. Next can you please make a video on some advanced projects for those who have comlpeted this video.

  • @Raj_Vishwa1
    @Raj_Vishwa1 Рік тому +1

    Ur Real King👑
    JavaScript Forever 👐

  • @olaiyahabeeb
    @olaiyahabeeb Рік тому +7

    You have forgotten to add "Best" to your video title "HTML CSS JavaScript projects for beginners 2023 - 12 js projects with source code". Please do that now! Coz, that's actually what it is.

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

    Thank you very much for the time dedicated to these interesting and useful projects for those of us who are learning. Your way of explaining is excellent and enjoyable, and what is learned is very practical.

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

    Thanks for the great lesson 👍
    My only concern is the part where you add json and the other objects for api.
    I wish it was better explained...🙏

  • @gauravtrivedi2754
    @gauravtrivedi2754 Рік тому +1

    Thanks for giving us this type of knowledge

  • @AbdulHafeez-ov4fw
    @AbdulHafeez-ov4fw Рік тому

    very interesting projects especially for beginners to make their interest in this field

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

    Awesome vedio to learn js

  • @niteshprajapat.d3v
    @niteshprajapat.d3v Рік тому

    One of the best project video!
    Thank you Sir ❤❤

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

    Thanks 👍👍
    check the temperature section CSS part comes first then html come

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

    I do not know if anyone noticed,but in the Temperature Converter Project CSS styling is done before HTML has been written.

  • @birendrayadav3089
    @birendrayadav3089 Рік тому +2

    Waiting

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

    Very educative project. Please check on the English Dictionary project, not all audo urls fall under the phonetics[0]. Try words like woman or girl. The audos are there in the API but they are far inside the dictionary.

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

      Thank you for your feedback on my English Dictionary project. I appreciate you bringing this issue to my attention.
      I will definitely check the API for the pronunciation audios of words like "woman" and "girl" and make any necessary adjustments to ensure that they are accessible to users.
      Thanks again for your input, it helps me improve the project and provide a better user experience.

  • @mfaiz6
    @mfaiz6 Рік тому +1

    Bless You!

  • @mohammadmirzaeirafsanjani4326

    Great

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

    Thank u very much for this! its helping me a lot and its super fun! . Greetings from Argentina!

    • @JavaScriptKing
      @JavaScriptKing  Рік тому +1

      thanks for watching and glad you found the video useful

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

      @@JavaScriptKing ❤️🤗

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

    Thankyou, very clear and easy to understand. 🤗

  • @Mohammadreza-Dolati
    @Mohammadreza-Dolati Рік тому

    Thanks a lot for your useful contents, I appreciate you because of these valuable information , ❤️ from Iran

  • @rakeshraki322
    @rakeshraki322 2 місяці тому +1

    Hlo can one say how to download json for English dictionary project and how to use .json is not working in my laptop

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

    Your content is next level.

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

    Great lecture. All the best Dr. Sahand

  • @Joy-rn1ux
    @Joy-rn1ux Рік тому

    Awesome help

  • @Sam_Gaming4
    @Sam_Gaming4 Рік тому +1

    lovely explanation

  • @RolanArjan
    @RolanArjan Рік тому +1

    Keep updating, sir. You made my day

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

    great video

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

    Hi sir, I'm your new subscriber from the Philippines🇵🇭, your explanation are so clear, can you please upload weekly? Teach us more about coding🤍 Thankyou in advance

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

    So fat so good! I've made it through 25 minutes and am not lost yet. Thank you. This looks like a great resource. Maybe I can do this:)
    One question I have is that I don't believe my Visual Studio shows a description of the class (if the term is correct) and what it does. On your video when you encounter the blue text I believe your site shows a description of what that means at the bottom of the page, like for example this is a combo of these colors. I don't think my VS provides thst description.
    Thanks if you can elaborate. :)

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

    this video is good and i understand a lot from it but if there was a little bit of animation in the website (examole: a loading effecr) it would be really useful

  • @SurajMaurya-jn6of
    @SurajMaurya-jn6of Рік тому +1

    I am Indian but your teaching methods very interesting

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

    Amazing Thank you for sharing your best happening

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

      You're welcome! I'm glad you enjoyed the content on my UA-cam channel. If you have any questions or suggestions for future videos, feel free to let me know. Thanks for watching!

  • @G_Ismaıl
    @G_Ismaıl Рік тому

    Waiting!

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

    really super do more videos

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

    Thanku so much 😀 🙏 . you are amazing , wonderful teaching 👍.

  • @griffer695
    @griffer695 Рік тому +1

    I followed this tutorial and made the dad jokes generator on my Samsung phone using Acode app.

  • @raunaksingh5779
    @raunaksingh5779 Рік тому +1

    Thanks for making video for API

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

    thank u so much sir for an amazing teaching a learning a lot

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

    Thank you for good videos

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

    I love all of your work

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

    Great video greet concepts, love from Pakistan ❤️

  • @Amanकुमार-y4m
    @Amanकुमार-y4m Рік тому

    Thankyou so much sir ❤😊😊❤❤

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

    completed. It was awesome!

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

    Awesome explaining method.. watched just this video and fell in love with u sir...😂

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

    I loved this channel!!!!!!!

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

    You are true king to the heir

  • @CGBORG-0502
    @CGBORG-0502 Рік тому

    Thank you for this wonderful video. 🙏

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

    Sir this is very informative thanks from core of my heart ❤️

  • @webprogrammingtutorials-alo69

    Excellent. Very useful. Thanks

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

    You are amazing 💞 thank you so much

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

    I love this video content sir.
    carry on sir please make a video on php.

  • @andrade1248
    @andrade1248 Рік тому +1

    Valeu thenks!

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

    thanks sir love u u r great what a work

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

    just what i was lookng for

  • @bfxlegend8049
    @bfxlegend8049 Рік тому +2

    Well sir,Where r u from ??
    BTW LOVE FROM 🇮🇳 🇮🇳 🇮🇳 INDIA

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

      IRAN mate

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

      @@JavaScriptKing daily I Complete one project and it's my 6 th project today and I am able to write js as well

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

      Great progress, thanks for sharing

  • @md.moijeuddinmolla1328
    @md.moijeuddinmolla1328 Рік тому

    We really need you . Thanks

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

    Hello dear sahand...your work is amazing and I learnt a lot and coded alongwith your videos & developed many projects from your true and deep efforts...thanks a lot and lots of love❤️ from India...actually I want also know that...may I use your projects references in my resume for job applications...thank you so much for your work again sir

    • @JavaScriptKing
      @JavaScriptKing  Рік тому +1

      no problem mate :)

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

      @@JavaScriptKing Thanks a lot sir...deeply obliged for you kind help❤️🙏👍🇮🇳🙂

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

    one thing i need to know from u and that is as a front end developer need to know about local storage

  • @Royal-1992
    @Royal-1992 Рік тому

    Awesome.. Thank you so much 😊

  • @-BC--AbhishekSingh
    @-BC--AbhishekSingh Рік тому

    amazing contents

  • @Lima-yd3cm
    @Lima-yd3cm Рік тому

    Adoro seu canal, abraços aqui do Brasil 🇧🇷

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

    Awesome sir you are too good teacher 💓
    🇵🇰🇵🇰🇵🇰