Phoenix Coder
Phoenix Coder
  • 32
  • 118 333
Form Validation for ALL TYPES of INPUT FIELDS Beginner TO ADVANCED Level - React Js Tutorial
In this video we will learn how we can handle and validate Forms in React without using any external package or library. We will validate the form using React Hooks. The best way to validate React Js Form. React form validation tutorial. How to handle and validate React form inputs using different ways. Handling forms in React using useState, useRef and FormData.
#react #reactjs #form #formvalidation #reactjsforbeginners #reactjsform #reactform #reacttutorial #reactjstutorial #reactjscourse #reactjsproject #coding #webdesign #webdevelopment
Source Code: drive.google.com/file/d/10rI2oSuCDFs5FKrikb0_jWDU2zI0gezI/view?usp=sharing
Download the zip file from above link and extract in your system then navigate your terminal into that folder and write npm install for installing all the dependencies of this project (node_modules folder).
Documentation: reactjs.org/
This video is part of my react js playlist
Link: th-cam.com/play/PLvQopDEGBbEC_-oL5eTA2FcpI2KqLzcNG.html
Please Like, Comment & Subscribe.
มุมมอง: 16 205

วีดีโอ

React Js Form Handling - React Js Tutorial
มุมมอง 41K2 ปีที่แล้ว
The best way to handle React Js Form. #react #reactjs #form #reactjsforbeginners #reactjsform #reactform #reacttutorial #reactjstutorial #reactjscourse #reactjsproject #coding #webdesign #webdevelopment Source Code: drive.google.com/file/d/1YAISounnTgxuR-8LeW-d0PMxzMVOuzmM/view?usp=sharing Download the zip file from above link and extract in your system then navigate your terminal into that fol...
6 Best Ways to Style React Components 2022
มุมมอง 1.5K2 ปีที่แล้ว
Styling React components is easy and difficult at the same time. There are so many options! Inline styles, styled components, vanilla CSS, CSS modules and more. Let's take a closer look at the 6 best ways to style your react components! #react #reactjs #styling #styledcomponents #css #cssmodule #coding #trending #webdesign #programmimg #sass Time Stamp 00:00 Intro 00:15 CSS File 05:32 Inline St...
Tips and Tricks of Margin and Padding in Bootstrap 5 | Bootstrap Spacing | Bootstrap 5 Tutorial
มุมมอง 22K2 ปีที่แล้ว
Bootstrap includes a wide range of shorthand responsive margin, padding, and gap utility classes to modify an element’s appearance. In this video explained every thing about bootstrap margin, bootstrap background padding, bootstrap spacing and basics of margin and padding with code. #bootstrap #margin #padding #bootstrapwebsite #coding #bootstrapcolors #webdesign #web #programmimg #coding #tren...
Bootstrap 5 Colors: Background, Gradient, Text Color, Text Background Color
มุมมอง 2.8K2 ปีที่แล้ว
Bootstrap is supported by an extensive color system that themes our styles and components. This enables more comprehensive customization and extension for any project. In this video explained every thing about bootstrap colors, bootstrap background colors, bootstrap text colors, bootstrap text background colors, bootstrap color gradient and lots more with code. #bootstrap #color #tutorial #boot...
What's New on Bootstrap 5.2.0 Beta Update? Dark Mode is Here! 🔥
มุมมอง 4.4K2 ปีที่แล้ว
It’s the biggest release since v5 itself-Bootstrap v5.2.0-beta1 is here! This release features redesigned docs, CSS variables for all our components, responsive offcanvas, new helpers and utilities, refined buttons and inputs, and lots of improvements under the hood #bootstrap #bootstrap5 #update #trending #darkmode #bootstrapupdate #cssvariables #offcanvas #docs #webdesign #debendu Bootstrap 5...
PyScript - Run Python In HTML | PyScript Tutorial | The End of Javascript?
มุมมอง 4K2 ปีที่แล้ว
Learn PyScript and Run Python code in Browser like the JavaScript. PyScript tutorial for beginners and you will Learn Pyscript in one video. PyScript is a framework that allows users to create rich Python applications in the browser using HTML’s interface. PyScript aims to give users a first-class programming language that has consistent styling rules, is more expressive, and is easier to learn...
Bootstrap Website Design Tutorial | Responsive Website Build using Bootstrap 5
มุมมอง 8372 ปีที่แล้ว
Building Responsive Website using Bootstrap 5 with Coding. One of the best video on bootstrap 5 website build. #bootstrap5 #webdesign #responsive #grid #system #bootstrap #tutorial #web #programmimg #coding #trending #debendu #debendudas Bootstrap 5 Tutorial Playlist Link: th-cam.com/play/PLvQopDEGBbEBmHdyptYM56BUQW-M3Idv7.html Bootstrap Documentation: getbootstrap.com/ Image Resources: unsplas...
Bootstrap 5 Grid System Explained with Code
มุมมอง 3.7K2 ปีที่แล้ว
Explaining Bootstrap 5 Grid System with Coding. One of the best videos on bootstrap 5 tutorial #bootstrap #grid #system #bootstrap5 #tutorial #webdesign #web #programmimg #coding #trending #debendu #debendudas Bootstrap 5 Tutorial Playlist Link: th-cam.com/play/PLvQopDEGBbEBmHdyptYM56BUQW-M3Idv7.html Bootstrap Documentation: getbootstrap.com/
Bootstrap Grid System Tutorial | Bootstrap 5 Tutorial
มุมมอง 5312 ปีที่แล้ว
Learn Bootstrap Grid System in 15 minutes #bootstrap #grid #system #bootstrap5 #tutorial #webdesign #web #programmimg #coding #trending #debendu #debendudas Bootstrap 5 Tutorial Playlist Link: th-cam.com/play/PLvQopDEGBbEBmHdyptYM56BUQW-M3Idv7.html Bootstrap Documentation for Grid: getbootstrap.com/docs/5.1/layout/grid/ Grid system is powerful mobile-first flexbox grid to build layouts of all s...
Bootstrap 5 Breakpoints | Types of Bootstrap 5 Breakpoints | Bootstrap 5 Tutorial
มุมมอง 1.3K2 ปีที่แล้ว
Breakpoints are customizable widths that determine how your responsive layout behaves across device or viewport sizes in Bootstrap. Core concepts: 1) Breakpoints are the building blocks of responsive design. Use them to control when your layout can be adapted at a particular viewport or device size. 2) Use media queries to architect your CSS by breakpoint. Media queries are a feature of CSS tha...
How To Use Bootstrap 5 | Add Bootstrap 5 to HTML | Bootstrap 5 Tutorial
มุมมอง 8182 ปีที่แล้ว
In this video I discussed about How to use Bootstrap and see How we can add Bootstrap in our website with CDN. Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains HTML, CSS and (optionally) JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components. #bootstrap #bootstrap5 ...
What is Bootstrap? | Introduction of Bootstrap 5 | Bootstrap 5 Tutorial
มุมมอง 5442 ปีที่แล้ว
Bootstrap is a free and open-source CSS framework directed at responsive, mobile-first front-end web development. It contains HTML, CSS and (optionally) JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components. #bootstrap #bootstrap5 #tutorial #webdesign #web #programmimg #coding #debendu #debendudas Bootstrap 5 Tutorial Playlist Link: th-cam....
Learn BHAILANG in 15 minutes | BHAILANG Tutorial for BHAI LOG😂
มุมมอง 3.6K2 ปีที่แล้ว
Bhailang is dynamically typed toy programming language, based on an inside joke, written in Typescript. Created by Aniket Singh and Rishabh Tripathi. #bhailang #programming #fun #debendu #india #bhai Time Stamp: 00:00 What is Bhailang? 01:03 Structure of Bhailang (hi bhai & bye bhai) 01:42 Printing in Bhailang (bol bhai) 02:28 Variables in Bhailang (bhai ye hai) 04:52 Comments in Bhailang 05:34...
Virtual DOM in React Js | Concept behind Virtual DOM
มุมมอง 5112 ปีที่แล้ว
Understand Virtual DOM with detailed explanation and concept behind Virtual DOM. Also Learn what is DOM(Document Object Model) ? why DOM is used? All of your doubts will be cleared with this latest video and it is the best video for Virtual DOM in React Js. You will get to know How does React update the DOM. Comparison between DOM and Virtual DOM. Some advanced topics like Diffing in React Js a...
IPL Website Clone with React Js | React js Project
มุมมอง 1.1K2 ปีที่แล้ว
IPL Website Clone with React Js | React js Project
Why we use map function instead of for loop? | map vs for vs forEach in javascript and react js
มุมมอง 2.1K2 ปีที่แล้ว
Why we use map function instead of for loop? | map vs for vs forEach in javascript and react js
Map function in React Js | How to use map function in React js
มุมมอง 2.8K2 ปีที่แล้ว
Map function in React Js | How to use map function in React js
I build the Hardest Game on React Js | Only 0.00001% can win | React Js Project for beginners
มุมมอง 5062 ปีที่แล้ว
I build the Hardest Game on React Js | Only 0.00001% can win | React Js Project for beginners
Top Programming Languages for Placements
มุมมอง 1732 ปีที่แล้ว
Top Programming Languages for Placements
React Event Handling You Should Know | Everything about Event Handling in React
มุมมอง 6602 ปีที่แล้ว
React Event Handling You Should Know | Everything about Event Handling in React
Learn React State with EDITH Glass Project | React Project for Beginners
มุมมอง 3792 ปีที่แล้ว
Learn React State with EDITH Glass Project | React Project for Beginners
Everything you need to know about Props in React Js
มุมมอง 2572 ปีที่แล้ว
Everything you need to know about Props in React Js
Everything about Functional Components in React
มุมมอง 2242 ปีที่แล้ว
Everything about Functional Components in React
Everything about Components in React
มุมมอง 2272 ปีที่แล้ว
Everything about Components in React
Everything about JSX
มุมมอง 2352 ปีที่แล้ว
Everything about JSX
Files & Folder Structure in React Js | Explain Every File & Folders
มุมมอง 5182 ปีที่แล้ว
Files & Folder Structure in React Js | Explain Every File & Folders
Creating Our First React App With create-react-app | React js complete tutorial 2022
มุมมอง 2932 ปีที่แล้ว
Creating Our First React App With create-react-app | React js complete tutorial 2022
How To Use Terminal | Git Bash vs PowerShell vs Command Prompt Comparison | Terminal Tutorial
มุมมอง 4.3K2 ปีที่แล้ว
How To Use Terminal | Git Bash vs PowerShell vs Command Prompt Comparison | Terminal Tutorial
Installation of VS Code & Extensions | Best Extensions for VS Code | Best Extensions For React.js
มุมมอง 1542 ปีที่แล้ว
Installation of VS Code & Extensions | Best Extensions for VS Code | Best Extensions For React.js

ความคิดเห็น

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

    Superbb.. Great Tutorial for Learning React Form. You explained very smooth way from beginning to advance

  • @kallurishyamsundhar7195
    @kallurishyamsundhar7195 27 วันที่ผ่านมา

    U saved me bro❤🎉 great content!!!

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

    Your accent is trrible

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

    Good One !

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

    Excellent content 👏💯 Thank you soo much ❤

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

    Please start complete react js from beginning snd cover sll topics

  • @zsuzsannamolnar-aczel984
    @zsuzsannamolnar-aczel984 7 หลายเดือนก่อน

    Were i can find these code? Is there a link to your repo?

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

    i dont understand that -1 thing

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

    good one

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

    loosu *** yetho onu olunga solriya da...mati online la code copy paste panitu undo panra

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

    Great video!

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

    Thank you, this was very clear!

  • @sammyay-man2754
    @sammyay-man2754 10 หลายเดือนก่อน

    I having a problem with pyscript and didn't work at all. I need help

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

    Well explained bro.. Thank you

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

    best video on form handling in reactJS

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

    Thank you for clearing my some basic concepts👍

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

    You did well explaining. Thank You

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

    thank you😃

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

    How you save the user data on a Nosql DB ? The checkbooks i mean

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

    How to include negative margin in bootstrap 5.3.1??????? I can't do this. Instruction tutorial in official site Bootstrap don't work. Thanks!

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

    Very nice explanation ❤

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

    #PhoenixCoder if I want a margin of more than 3rem (m-5) then what will I code with the help of Bootstrap, I mean m-2, m-3, m-4, m-5, m-??????

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

      By default, Bootstrap only provides up-to m-5 margin. You can add more sizes by adding entries to the $spacers Sass map variable or you can write your own CSS.

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

      @@DebenduDas and without sass...??? cz I don't want to use sass just for margin and padding

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

      You can create a div and give m-5 or p-5.. and create a child div with m-5 or p-5 to get in total m-10 or p-10 space.

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

      @@DebenduDas aapka koi bhi social account hai jha main aapse detail mein baat kar skta hoo ? koi bhi like insta github anything.....please

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

    Great explanation..

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

    Awesome awesome explanation, Really helped me out a lot🤗.....Keep up the good work👍💯👏

  • @DurgeshKumar-gx1bl
    @DurgeshKumar-gx1bl ปีที่แล้ว

    How to prevent duplicate email entry in database from front side

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

    Hey bro.. feeling good to watch these types of video. You got a subscriber. Keep growing 💚

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

    Good explanation. I learnt a lots from this video

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

    Thank you. This is a great video. Your explanantion using the console helped me to get a better understanding of event objects.

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

    Bro u r ultimate😍

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

    thanks, great video and presentation

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

    nice explanation sir 👍👍

  • @SushilKumar-xh1dv
    @SushilKumar-xh1dv ปีที่แล้ว

    very well explained thank a lot !!

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

    superb explanation, dude can you please make a tutorial for same form but handling the errors on onchange handler

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

    Great explanation, thank you

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

    GG

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

    Hi..........krishna kumari here.. Thank you for the video

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

    Nice explained 👍👍

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

    thanks bro

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

    Why background music bro? Plz don't use any

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

    Hi Debendu I really liked all your react videos, please make more react videos like json data fetching, firebase database storage & redux also do one woo commerce react project for our reference

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

    Really cool but to understand code it is little bit difficult

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

    nice tutorial clear my confusion

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

    I love python but. Javascript will never die.

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

    Appreciate your thorough explanation thank you sir

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

      Thank you.. keep watching

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

    On language we cannot change once we clicked.. Pls resolve it.. I want to know

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

      It means once we click HTML.. We cannot unselect it.. This is a bug

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

    One bug is there

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

    Please upload more videos like this asap ❤

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

    Learned a lot of unknown things ..thanks a lot ❤️

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

    please make upload all files and folders source code via Github for better, then please do share link.

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

      Thanks for your suggestion. I will use git for sharing my source code from now on. Kindly download the source code from google drive for this video. Thank you <3