React JS + Spring Boot REST API Example Tutorial

Поделиться
HTML-код
  • Опубликовано: 3 июл 2020
  • In this tutorial, we will create a "single page application" using React as frontend and spring boot as backend.
    What we will build?
    ---------------------------------------------------------------
    We will build two projects:
    1. springboot-backend (server) - To Develop REST API
    2. react-frontend (client) - Consume REST API
    Read the blog post and get the source code of this tutorial at www.javaguides.net/2020/07/re...
    If you want to use React Hooks then check out • React JS (React Hooks)...
    #react #springboot#javaguides
    My Top 10+Udemy Courses (Bestseller Courses):
    1. Spring 6 & Spring Boot 3 for Beginners (Includes 5 Projects):
    www.udemy.com/course/learn-sp...
    2. Building Real-Time REST APIs with Spring Boot - Blog App:
    www.udemy.com/course/building...
    3. Building Microservices with Spring Boot and Spring Cloud:
    www.udemy.com/course/building...
    4. Testing Spring Boot App with JUnit, Mockito & Testcontainers:
    www.udemy.com/course/testing-...
    5. Spring Boot 3 Thymeleaf REAL-TIME Web Application - Blog App:
    www.udemy.com/course/spring-b...
    6. Master Spring Data JPA with Hibernate:
    www.udemy.com/course/master-s...
    7. Spring Boot + Apache Kafka Course:
    www.udemy.com/course/spring-b...
    8. Spring Boot 3 + RabbitMQ Course:
    www.udemy.com/course/spring-b...
    9. Learn Thymeleaf with Spring Boot 3:
    www.udemy.com/course/learn-th...
    Check all my Udemy courses and discount coupons:
    www.javaguides.net/p/my-udemy...
    Visit My Top Java Guides Blog: www.javaguides.net/

Комментарии • 167

  • @JavaGuides
    @JavaGuides  3 года назад +12

    React (React Hooks) + Spring Boot Tutorial - ruclips.net/video/iZqp4B2xkS4/видео.html
    Free Course - ReactJS + Spring Boot CRUD Full Stack Application series at ruclips.net/video/n43h1eJ2EUE/видео.html

  • @mohantalachutla6834
    @mohantalachutla6834 3 года назад +107

    If you came here to know how to connect between "react" and "spring" ,-> 24:50.
    Nicely done.

  • @VANTYCSolutions
    @VANTYCSolutions 4 года назад +74

    This video is solid gold. I just want to clarify that what you explain in your 39 minutes of video takes up to 450 tedious and boring classes on other platforms to explain the same thing. You save hours or even days of our time. There is no way to thank you for the effort of this magnificent work. 👍👍👍 👏👏👏.

    • @kitchen-e-kausar9105
      @kitchen-e-kausar9105 3 года назад +1

      could not agree more, I was so afraid to get into this topic because I dont know spring boot, but length of this video motivated me and I understood things, now Im less paranoid about it. Ofcourse I will need to learn it, but this atleast gives me an idea.

    • @elbozo5723
      @elbozo5723 2 года назад

      you really need to raise your standards

  • @user-vm6km2cp3u
    @user-vm6km2cp3u 3 месяца назад

    Honestly the best tutorial i've ever come across on Spring boot. Great that, you've explained both the frontend and backend, though it's mainly a backend tutorial. Thanks a ton.

  • @bhawanapurandare1382
    @bhawanapurandare1382 3 года назад +18

    This tutorial has the most useful content than any other I found on the web. Got to learn a lot! Thank you!

  • @anjalitomar3100
    @anjalitomar3100 4 года назад +1

    Only since yesterday started to work on springboot ,making project. Got this tutorial as a beginner which is nice. I will follow up with it to get more related stuff in springboot.

  • @johnwiddifield4429
    @johnwiddifield4429 3 года назад +3

    Great content, learned a lot. Thank you!

  • @daajason
    @daajason 2 года назад

    Exactly what I needed! Thanks so much!

  • @benceszke7209
    @benceszke7209 3 года назад +2

    honestly... this may have been the best tutorial i have seen sofar

  • @alissoncode9352
    @alissoncode9352 3 года назад +1

    Thank you for the amazing tutorial!

  • @rinado4374
    @rinado4374 3 года назад +2

    This video was so helpful thank you so much!

  • @pawansnair997
    @pawansnair997 3 года назад

    this was awsome keep up with new videos. I am subscribing it now, awsome content in just 40min

  • @cw9681
    @cw9681 3 года назад +1

    This awesome tutorial Very straight forward and helpful. It includes how to debug. Thanks a lot.

  • @fromearthc-3427
    @fromearthc-3427 2 года назад +1

    Appreciate your work bro!

  • @rtav1980
    @rtav1980 2 года назад

    Very useful. Great content, learned a lot. Thank you! 👏👏👏 👍👍👍

  • @amritsvnit
    @amritsvnit 3 года назад

    Sweet and simple explanation !!! thanks

  • @muratbahadrdemiroz6018
    @muratbahadrdemiroz6018 2 года назад +1

    Great course, thanks for sharing it.

  • @panfrog489
    @panfrog489 2 года назад

    Incredible, thanks :) !!

  • @divyagahlot6527
    @divyagahlot6527 3 года назад

    Thank you so much for this treasure!

  • @CARLOSOLIVA92
    @CARLOSOLIVA92 3 года назад

    Thank you so much friend! It helped me a lot

  • @chadsmith71
    @chadsmith71 4 месяца назад

    Very nice tutorial. Short and to the point, but very clear. You use the same tools I use, and I like the way your organize your code (model package, controller package, repository packaget, etc). A lot of tutorials don't do that and I just think it is sloppy.

  • @ansariextc1
    @ansariextc1 2 года назад

    Thanks for creating this project - helps in workig on basics.

  • @kitchen-e-kausar9105
    @kitchen-e-kausar9105 3 года назад

    Very nice video, to the point,thank you.

  • @quanphung8231
    @quanphung8231 2 года назад

    You helped me so much

  • @aaronfrey2424
    @aaronfrey2424 3 года назад +1

    Great tutorial :D

  • @TheSilvina45
    @TheSilvina45 2 года назад

    Very useful. Thank you sir!

  • @jesse420SOCAL
    @jesse420SOCAL Год назад

    nice so cool thanks now i can hook up my react and java projects thanks

  • @raphaeltaglialegna9668
    @raphaeltaglialegna9668 2 года назад

    Good tutorial! Thanks!

  • @lingam3717
    @lingam3717 Год назад

    Excellent ever video no word to say it's beauty. Really amazing

  • @khanhtoanle525
    @khanhtoanle525 2 года назад

    thanks for the tutorial ! it's absolutely for beginner like me

  • @qaziiffatjabeen
    @qaziiffatjabeen 3 года назад

    Wow Thank You Sir this video has been such a great help

  • @ashwinkumar-hb8tz
    @ashwinkumar-hb8tz 2 года назад

    Superb video, crisp in terms of concepts

  • @prabuddhakulatunga9091
    @prabuddhakulatunga9091 3 года назад

    useful video. Thank you very much! 👌😊

  • @user-qw5dj5sz3x
    @user-qw5dj5sz3x 3 года назад

    Great content, thanks alot!

  • @desi4masti
    @desi4masti 3 года назад

    Very Good Tutorial. Thanks

  • @shafikul1975
    @shafikul1975 3 года назад

    Useful video tutorial. Thanks

  • @smacdonald2012
    @smacdonald2012 2 года назад

    Excellent Vid!!!

  • @kamleshprajapati6621
    @kamleshprajapati6621 4 года назад

    Thanks for starting..🙏

  • @SreyesSrinivasan
    @SreyesSrinivasan 2 года назад

    Fabulous video!

  • @MrMoscs
    @MrMoscs 2 года назад

    Thank you for your great video.

  • @jerzykepinski
    @jerzykepinski 2 года назад

    Thanks man!

  • @YeahPerdonen77
    @YeahPerdonen77 Год назад

    thanks, i think this gonna help me

  • @bhushanmali2598
    @bhushanmali2598 Год назад

    Very useful. You are awesome man. Love from Maharashtra ❤️

  • @adityasingh1.083
    @adityasingh1.083 2 года назад

    Awesome video... Very helpful

  • @gulasebastian1990
    @gulasebastian1990 3 года назад

    Good job!! U saved me

  • @taregbalola
    @taregbalola 3 года назад

    Very clear thanks

  • @funcoding1797
    @funcoding1797 Год назад

    thanks. great. short and very useful

  • @JebaTM-nq8bp
    @JebaTM-nq8bp 2 года назад

    wow... Its very easy and step by step clear learning process. I got the app too.

  • @krishnarohit3166
    @krishnarohit3166 3 года назад

    Thanks a lot sir! you are awesome

  • @sagarsri4143
    @sagarsri4143 4 года назад

    Superb 👌 Explanation

  • @armansotude1474
    @armansotude1474 2 года назад

    Dear Ramesh thank you very much I always learn from you

  • @itachi-senpaii
    @itachi-senpaii 2 года назад

    *THANK YOU SO MUCH ... YOU ARE AWESOME ...*

  • @varnanthirugnanasambandan559
    @varnanthirugnanasambandan559 2 года назад

    Very good and very useful.

  • @akshayjangde8510
    @akshayjangde8510 Год назад

    very very helpful...sir thanks for this amazing content

  • @Ludo045
    @Ludo045 2 года назад

    Very good tutorial.

  • @pavansai6847
    @pavansai6847 3 года назад

    saved my day

  • @dulcisfate6060
    @dulcisfate6060 3 года назад

    Thank you!

  • @darthvadar2915
    @darthvadar2915 2 года назад

    Really really good

  • @meenajadhav5533
    @meenajadhav5533 4 года назад

    Nice explanation line by line coding

  • @quanghuy3509
    @quanghuy3509 2 года назад

    thank you so much

  • @shakib651
    @shakib651 3 года назад +3

    I would highly suggets this video. It very well explains how react and springboot app can be linked. Thanks man.
    P.S: I worked on react seperately and springboot seperately already.

    • @sanketaher493
      @sanketaher493 2 года назад

      where do u learn them spring and react

    • @shakib651
      @shakib651 2 года назад

      @@sanketaher493 for springboot, I referred to a udemy course 'in28minutes master java webservices amd restful api using springboot' and 'reactjs Web developer by igneous technologies'.
      If wait for the right time, you can buy the above courses for as less as 380rs each

    • @RahulSingh-nd9xe
      @RahulSingh-nd9xe 2 года назад

      ​@@shakib651 can u help?

  • @pitchireddyb646
    @pitchireddyb646 4 года назад

    Excellent

  • @nagendrapp2213
    @nagendrapp2213 4 года назад

    thanks for the content finally understood how to connect react with springboot if possible use mysql db

  • @alenabraham7857
    @alenabraham7857 3 года назад

    Very good presentation bro...I'm going to view full stack also...

  • @traju2737
    @traju2737 Год назад

    Thank you soo much anna

  • @harierigineni3820
    @harierigineni3820 4 года назад

    Excellent sir

  • @chitranshsharma9764
    @chitranshsharma9764 3 года назад

    Can you tell if we want to post the data of the table to backend and how to give an add row option for the table

  • @olive_vlogs77
    @olive_vlogs77 2 года назад +1

    Great

  • @mejdeddine.n6050
    @mejdeddine.n6050 3 года назад

    Thank you

  • @sagarshekhar6296
    @sagarshekhar6296 3 года назад

    awesome

  • @sairamsunkam7978
    @sairamsunkam7978 2 года назад +1

    this is a good tutorial because it is a basic level rest api, however, can you comment on your code of what you are doing just because for me I had to rewind several times on a couple of things you just did that didn't make sense to me atleast, maybe im little slow so if you can do that it would be helpful as a tutorial. We are all learning at the end of the day and since you are a definite expert it would be nice to just comment stuff out in a general sense. Thanks for the videos, they are a blessing!

  • @santiagowhite5467
    @santiagowhite5467 3 года назад

    What if I wanted to fetch a product given a certain id?

  • @nikhilhinge7489
    @nikhilhinge7489 3 года назад

    thank u sir

  • @gizemtak224
    @gizemtak224 7 месяцев назад

    can ı ask a question? ı do it step by step your video. But finally, npm start is not is a refresh page. npm start error. how can do solve it problem

  • @ruiarmada1201
    @ruiarmada1201 3 года назад

    awsome

  • @sudipkumar3487
    @sudipkumar3487 3 года назад +1

    Hi,I have a doubt....after deployment ,will the react application run for users ??? or there are some other npm packages which need to be installed like webpack or babel?

  • @subramanianchenniappan4059
    @subramanianchenniappan4059 2 года назад

    I am an experienced java developer . Know spring boot but not react . I wil go thru . Thanks

  • @PraveenKumar-fu2bt
    @PraveenKumar-fu2bt 2 года назад

    table table-striped command is not recognized it's just display the data but table format is not as same as the video, anyone help on this?

  • @sreeguru6377
    @sreeguru6377 Год назад

    Hi ramesh ..am getting datasource url attribute is not specified error on starting the server..

  • @luckykeswani6746
    @luckykeswani6746 3 года назад

    great

  • @jetlavi
    @jetlavi 3 года назад

    Can you help me, when I print , time 33:36, I receive
    Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.
    Check the render method of `App`.
    function App() {
    return (



    );
    }

  • @miltonmamani
    @miltonmamani 3 года назад

    So basically you have 2 servers in different ports talking each other. is it possible to run react in java server side, to have only one server port?

  • @crowbr
    @crowbr 2 года назад

    how you deploy this application in server? build this or just put all files in server?

  • @aishwaryanemade8081
    @aishwaryanemade8081 3 года назад

    You gave the content and explained it in a good way but the main thing why I saw the whole vedio was not there. Please complete the vedio explaining the exact flow of the application as how does it travel from frontend end to backend through classes and back to frontend!!!

  • @ashikbatchu
    @ashikbatchu 3 года назад

    I am unable to display data in table. But i didn't got any error.

  • @getsuccess9705
    @getsuccess9705 2 года назад

    Mst

  • @tiashabhowmik9540
    @tiashabhowmik9540 4 года назад +16

    Amazing content.🙏Please create a full stack end to end project with reactjs, spring boot and mongodb or with any other external database.

    • @rinado4374
      @rinado4374 3 года назад +1

      i agree!

    • @shakib651
      @shakib651 3 года назад +5

      The steps would remain same. Here we had H2 database which is inbuilt. Just see how you can configure the SpringJpa to point to a Mongodb instance.

  • @sreeguru6377
    @sreeguru6377 Год назад

    Hi Ramesh am facing below issue.
    ./src/App.js
    Attempted import error: '/Users/Documents/ReactJs/my-app/src/component/UserComponent.js' does not contain a default export (imported as 'UserComponent'). can you please help.?

  • @luongtran43
    @luongtran43 3 года назад

    Useful video tutorial. Can you create a "shopping cart application" using React as frontend and spring boot as backend?

  • @santoshreddy2998
    @santoshreddy2998 3 года назад

    Where do you give Data base details How did it saved in database?

  • @sureganeshreddy6262
    @sureganeshreddy6262 3 года назад

    Could you provide complete tutorial on reactjs from starting position.

  • @arunartsy7001
    @arunartsy7001 3 года назад

    You can directly use the axios call in the user Component itself inside componentDidMount() and no need of separate component to define URL and to return the axios.

    • @JavaGuides
      @JavaGuides  3 года назад +2

      It it good practice to keep rest client code ( axios) in service class so that it can reused in different components. Don't keep axios code in react component. Follow my approach

    • @arunartsy7001
      @arunartsy7001 3 года назад

      @@JavaGuides cool, thanks for d video

  • @michaborciuch9172
    @michaborciuch9172 3 года назад

    Very nice tutorial. But what about deployment? How one can build war from this?

  • @mohammedmahmood9813
    @mohammedmahmood9813 11 месяцев назад

    mr ramesh beautifully explained very nice thanks lot can u please put code for using three tables or 3 entitites in jpa data

  • @obaidabbasi7156
    @obaidabbasi7156 Год назад

    Can we use java without springboot as backend?

  • @7doghead
    @7doghead 4 года назад

    can you please create a tutorial on how to use react + the spring boot rest api to make something like an expense calculator? thank you!

  • @shivani-mh3hk
    @shivani-mh3hk 3 года назад +1

    Hi, I tried the same application step by step in my system. Backend works great. however in front end react JS , i keep getting compilation error at 38.44 - this.state.users.map( users => ...... ). Please let me know.

    • @hienvan7386
      @hienvan7386 3 года назад

      me too

    • @MattWerth
      @MattWerth 3 года назад +1

      Make sure to add a return statement inside of the getUsers() function and also just before the ...

  • @ravivyas2005
    @ravivyas2005 3 года назад

    Instead of Two Server. Can we do on Single Server.? Is it Possible????

  • @DeepakLalchandaniProfile
    @DeepakLalchandaniProfile Год назад

    What about create,update and delete on the react frontend ?

    • @JavaGuides
      @JavaGuides  Год назад

      ReactJS + Spring Boot CRUD Full Stack Application series at ruclips.net/video/n43h1eJ2EUE/видео.html

    • @DeepakLalchandaniProfile
      @DeepakLalchandaniProfile Год назад

      Where did you learn react.js from ?

  • @crazyexperiments7172
    @crazyexperiments7172 3 года назад

    This.state.users.map is not a function why i am getting this error sir