No video

React: Send email from contact form without server code - Email.js Tutorial

✨ Join My Discord Server
/ discord
Source code: github.com/cha...
Buy My React Portfolio Course: chaoocharles.g...
Donate 🤑
- Your support will help me to upgrade my setup for better quality content and more videos per month.
📍Donate with PayPal: www.paypal.com...
SUPPORT MY CHANNEL
📍SUBSCRIBE: / @chaoocharles
📍Become a Channel Member: / @chaoocharles
📍Join My Fun Channel: / @chaaoo
GET IN TOUCH:
📍 Twitter: / chaoocharles
Disclaimer: This video is not sponsored

Пікірлер: 233

  • @siddharthagarwal8617
    @siddharthagarwal8617 Жыл бұрын

    User ID is replaced by Public key which can be find in settings

  • @ChaooCharles

    @ChaooCharles

    Жыл бұрын

    Thank you!

  • @MilanPatel-ri7my

    @MilanPatel-ri7my

    Жыл бұрын

    can i use this service for my client's site?

  • @siddharthagarwal8617

    @siddharthagarwal8617

    Жыл бұрын

    @@MilanPatel-ri7my yes

  • @fadelellaherrami8840

    @fadelellaherrami8840

    9 ай бұрын

    thank you

  • @MeArron

    @MeArron

    4 ай бұрын

    Now found in Account

  • @aslan6921
    @aslan6921 Жыл бұрын

    This was realy helpful, thank you! Btw, If you want to prevent your email from being spammed with empty emails, make sure to implement form validation. Currently, even if the input fields are empty, the email will still be sent. By adding validation, you can ensure that the user fills out all required fields before sending the email.

  • @desmondmpofu4083
    @desmondmpofu40832 жыл бұрын

    Thank you so much this has helped me a lot, in case the integration tab is not in your dashboard, go to "Account" tab and you will find the API keys there.

  • @Teos2911
    @Teos2911 Жыл бұрын

    Thanks a lot, I spent like three hours trying to figure out how this library worked. But your video was straightforward, well detailed and precise.

  • @alltoall

    @alltoall

    Жыл бұрын

    kzread.info/dron/cvrowWWzbIIErU164UAtgQ.html

  • @pracco
    @pracco Жыл бұрын

    Thanks, mate for posting the video. I'd like to advise that "YOUR_USER_ID" should be replaced with "PUBLIC_KEY" which is now under Account>API Keys

  • @Ninjajitsu562

    @Ninjajitsu562

    Жыл бұрын

    cute

  • @yannickmulikuza6364

    @yannickmulikuza6364

    Жыл бұрын

    Yeah, just found out too

  • @Thhs3

    @Thhs3

    Жыл бұрын

    Yeah

  • @sportsstimulant4228

    @sportsstimulant4228

    Жыл бұрын

    How to hide your user id in .env file ??

  • @sportsstimulant4228

    @sportsstimulant4228

    Жыл бұрын

    CN you explain suppose .env file write "PUBLIC _KEY "= "123456789abcd" Then how to write code in main file ? Process.env{PUBLIC_KEY} ???

  • @Samflaful
    @Samflaful Жыл бұрын

    Thank you! I just finished a bootcamp and I'm putting my portfolio together, I feel like this integration will really help with getting people to reach out, as it's taking so many steps out of the process of reaching me. The guide was super clear, I really appreciate it!

  • @ChaooCharles

    @ChaooCharles

    Жыл бұрын

    You're welcome 😊

  • @OhShiverMeTimbers

    @OhShiverMeTimbers

    Жыл бұрын

    Mind if I ask how your job hunt went/is going? I just finished a bootcamp a month ago and would be interested to hear how things went for you after finishing :)

  • @Samflaful

    @Samflaful

    Жыл бұрын

    @OhShiverMeTimbers nobody in my cohort (myself included) managed to get a job. The market basically locked up as we got our certs of completion and bootcamps in general seem to not appeal to employers anymore. I think some other members of my class are still looking but I've given up. I tried grinding really hard on putting out applications and coding, but I had very few interviews and no callbacks, even for entry level and internships. The course itself was expensive and I basically obliterated my savings paying for it and then trying to job search and practice full time afterwards. I went back to my old restaurant job, and I'm just trying to make the best of it. I'm sorry this is probably not the sort of answer you were looking for, but it's not really the outcome I was hoping for, and the whole experience has been pretty tough. Not that I'm in a position to give advice, cause I didn't really "make it" but I don't think it's impossible. If you just hold down a job to support yourself and spend your spare time coding/ studying/ applying I think you'll make it. It's still a broad and expanding industry, and it'll open up again as some of the FANG companies start hiring again in the coming year. You just need the willingness to keep trying, and a sincere passion for coding. Best of luck to you, stranger.

  • @roseiyera
    @roseiyera11 ай бұрын

    Something others tried to teach in 1 hour you did in 11 minutes and it worked so well👏👏👏👏

  • @petermwansa4890
    @petermwansa489021 күн бұрын

    Perfect tutorial!!! Thank you mate!

  • @mahamdabdi
    @mahamdabdi Жыл бұрын

    this is helpful thank you very much chaoo charles i love anyone talk about web development

  • @bp-ob8ic
    @bp-ob8ic Жыл бұрын

    Nicely done!! Adding this to my portfolio contact page just got a lot easier.

  • @ModiKrushil-m3n
    @ModiKrushil-m3nАй бұрын

    It's really helpfull and your explaination were straightforward man.thank you so much guy for help.😊😊

  • @amanahirwar9236
    @amanahirwar9236 Жыл бұрын

    thank youa lot bro, you're the only one who's made a great comprehensive tutorial on emailjs. good luck.

  • @pakkojang202
    @pakkojang2028 ай бұрын

    Thank you so much. This information is very useful. I thought that I need to setting the backend first to make the form functional 😆

  • @harz9556
    @harz95569 ай бұрын

    Very fast one! Thank you for sharing :)

  • @bhaskarkumar8812
    @bhaskarkumar8812 Жыл бұрын

    Sir I am not getting where the integration section is

  • @nellison
    @nellison9 ай бұрын

    You're the goat!!! Thanks it worked guys.

  • @craigjohnson8279
    @craigjohnson82792 жыл бұрын

    Great video Charles. Thanks for sharing the knowledge, I learned a lot. :)

  • @ChaooCharles

    @ChaooCharles

    2 жыл бұрын

    Great buddy

  • @anupamaherath4983
    @anupamaherath49834 ай бұрын

    Thankyou sirr for you tutorial may god bless you....... love from Srilanka...

  • @gtry1966
    @gtry1966 Жыл бұрын

    thanks, man. you're big help to my thesis

  • @lemibekele669
    @lemibekele6693 ай бұрын

    So helpful you saved a ton of time! thank you

  • @veejay33
    @veejay332 жыл бұрын

    This video helped me a lot! Thank you and also you have the nice portfolio website :)

  • @ChaooCharles

    @ChaooCharles

    2 жыл бұрын

    Thank you!

  • @muhumuzaallan7915
    @muhumuzaallan79153 ай бұрын

    thank you big boss it has worked and you have saved lots of hours for me your amazing

  • @drewe9514
    @drewe951411 ай бұрын

    Big help, thanks for this easy to follow tutorial!

  • @seyedahmadqz
    @seyedahmadqz6 ай бұрын

    It's useful but I couldn't use this service. Now after watching your video I must tray again. 😊

  • @AleRom
    @AleRom9 ай бұрын

    Thank u so much, cheers from Argentina!

  • @Pinwinazo
    @Pinwinazo Жыл бұрын

    incredible, fast and effective, thank you very much new subscriber

  • @AaronTMac
    @AaronTMac Жыл бұрын

    you're an amazing human being, thank you so much

  • @GreenPear-mz4dl
    @GreenPear-mz4dl Жыл бұрын

    absolutely useful and easy to follow, it works perfectly, thank you so much, you got my subscribe!

  • @seananih7609
    @seananih7609 Жыл бұрын

    This was extremely helpful, thanks!

  • @sayazdir
    @sayazdir2 жыл бұрын

    Thank you so much. Can anyone explain why don't we need to store the form data in a state, as we normally would with forms in React?

  • @craigjohnson8279

    @craigjohnson8279

    2 жыл бұрын

    The data is sent to Emailjs through the sendForm method. That's why you specify the Service ID, Template ID, and Public Key. Once you click send, the data is sent to your account.

  • @santra528
    @santra528 Жыл бұрын

    Don't you think this approach has security issues since here we are storing the serviceId, templateId and public tokens in the frontend code so anyone probably can get hold of these details ?

  • @vincentnwosu6803

    @vincentnwosu6803

    8 ай бұрын

    make use of an .env file to fix that in production

  • @nicolasbarthes7622
    @nicolasbarthes762210 ай бұрын

    Just thank you !! Subscribed !

  • @stealthmunky
    @stealthmunky Жыл бұрын

    Really simple tutorial, nice work, really appreciate valuable content like this 👍👍

  • @yofanalfiatur2779
    @yofanalfiatur277911 ай бұрын

    thank you your video really helped me as a beginner 🙌🙌🙌

  • @TheSoulCrisis
    @TheSoulCrisis4 ай бұрын

    Solid guide.....great work sir!

  • @phantasythenoob
    @phantasythenoob Жыл бұрын

    Good to see a brother from Kenya on the YT tech scene

  • @ChaooCharles

    @ChaooCharles

    Жыл бұрын

    Thanks bro...

  • @fredlesh8610
    @fredlesh8610 Жыл бұрын

    Thanks nice tutoriel i appreciate a lot u don't know how much u helped me

  • @vinaybhojwani998
    @vinaybhojwani998 Жыл бұрын

    Thanks brother! It was a great help :)

  • @user-ni8ro1wg3d
    @user-ni8ro1wg3d Жыл бұрын

    Thank you so much, this was very helpful and it was time saving.:)

  • @user-jr6jk5xi5y
    @user-jr6jk5xi5y5 ай бұрын

    Aff Module not found: Error: Can't resolve 'styled-components' in 'C:\production github react\mystate\src'

  • @hardtospell
    @hardtospell5 ай бұрын

    Is there a way to add dynamic data to the forms? I have an order form similar to yours which has a selections of goods unique for every client. The data I have is an array of ids and names of the products that a user selected.

  • @nathanielgonzalez9598
    @nathanielgonzalez95986 ай бұрын

    Thank you so much for your video! It was incredibly helpful

  • @ChaooCharles

    @ChaooCharles

    6 ай бұрын

    Glad it was helpful 🫡

  • @morganphemba648
    @morganphemba6489 ай бұрын

    This video was SUPER useful !

  • @ChaooCharles

    @ChaooCharles

    9 ай бұрын

    Awesome 👌

  • @XenothGaming
    @XenothGaming Жыл бұрын

    Great Video! Clear and concise!

  • @titoboyabunda4763
    @titoboyabunda47634 ай бұрын

    ty so much bro new subscriber here!

  • @ankurparchani3230
    @ankurparchani3230 Жыл бұрын

    Nice work. You explained it very neatly.

  • @leonardodias2154
    @leonardodias2154 Жыл бұрын

    Great vídeo Chaoo, you are so cool. Thanks for the explanation. ;)

  • @b0b0_
    @b0b0_7 ай бұрын

    THANKS SOO MUCH BRO, VERY COOL

  • @muubaraq
    @muubaraq6 ай бұрын

    After hosting. It is requesting for public key even when the public is available. On local host it works

  • @fluffybubble6872
    @fluffybubble6872 Жыл бұрын

    Pretty good explanation, thanks for tutorial!

  • @syncosota
    @syncosota Жыл бұрын

    thank you chaoo charles. well expalined and easy to implement🙏

  • @code-with-vivek
    @code-with-vivek3 ай бұрын

    Very nicely explained...

  • @Filip-_-._.
    @Filip-_-._. Жыл бұрын

    Thank you! Great video :)

  • @jpcc1223
    @jpcc12232 жыл бұрын

    you helped me A LOT! thank you so much!

  • @ChaooCharles

    @ChaooCharles

    Жыл бұрын

    Welcome buddy

  • @shalomsanbi
    @shalomsanbi Жыл бұрын

    Thank you, I finally got this to work^U^

  • @masudranaofficial99
    @masudranaofficial99 Жыл бұрын

    Thank you brother. very good tutorial was for me

  • @crvenioklop1217
    @crvenioklop1217 Жыл бұрын

    great bro,its work with next.js as well if somebody use it,tnx a lot bro

  • @amreenkhatik9952
    @amreenkhatik995212 күн бұрын

    Why i m getting "Template: One or more dynamic variables are corrupted" in my email

  • @shabiulhassan3397
    @shabiulhassan3397 Жыл бұрын

    I love your Video your video help me alot bro❤

  • @TaneKaio-qe9mc
    @TaneKaio-qe9mc Жыл бұрын

    Fantastic explanation, thank you!

  • @syedsalmanali7359
    @syedsalmanali735911 ай бұрын

    Very Helpful design thanks.

  • @accountdept7963
    @accountdept7963Ай бұрын

    this is secure or not? can i use real time project for company website

  • @aie007
    @aie0078 ай бұрын

    Thank you

  • @EronMahmuti
    @EronMahmuti Жыл бұрын

    integration page isn't active anymore in emailjs dashboard, can someone please tell me how to find userID, even chatGPT doesn't know how

  • @EronMahmuti

    @EronMahmuti

    Жыл бұрын

    In case someone has the same problem as mentioned, just use the public key instead of userID and you can find it in account page of dashboard ;)

  • @fatimaahmad5734
    @fatimaahmad573412 күн бұрын

    should we be using this emailjs in real project?will there be any security concerns?

  • @elliecottrell4574
    @elliecottrell4574 Жыл бұрын

    Great video, thanks! :) 😃

  • @williamdevonshire356
    @williamdevonshire35610 ай бұрын

    they changed the website and dont have an integration tab to lead to finding the public key with the apis... (update, I found it in the "Account" tab at the top

  • @bryandelacruz9066
    @bryandelacruz90669 ай бұрын

    I'm having a problem on console "Invalid value for prop `submit`"

  • @luxi1415
    @luxi1415 Жыл бұрын

    Thank you ! You make it easy !

  • @Karrnfr
    @Karrnfr10 ай бұрын

    Nice video, Thanks

  • @alexg7282
    @alexg7282 Жыл бұрын

    Works perfectly ! Ty

  • @estevaolibardi
    @estevaolibardi2 жыл бұрын

    Thank you so much my friend!

  • @MichellQHernandez
    @MichellQHernandez Жыл бұрын

    Excelente video!! Saludos desde colombia!!

  • @ashurawat850
    @ashurawat850 Жыл бұрын

    Thank you, helps me alot 😊

  • @chiarabissolo6631
    @chiarabissolo66314 ай бұрын

    Thank you so much!!!!

  • @antoninosartori
    @antoninosartori Жыл бұрын

    Thanks for this tutorial. I have a question. How do you do to make a loading state for that moment when you click to sent the email. I mean, in that moment i wanna see a "loading"

  • @melissastan6884
    @melissastan6884 Жыл бұрын

    Much appreciated it!

  • @safaakhoudja2092
    @safaakhoudja2092 Жыл бұрын

    thank you so much for this tuto very usefull

  • @satishmaurya2089
    @satishmaurya20892 жыл бұрын

    Thankyou so much for this wonderful content

  • @alltoall

    @alltoall

    Жыл бұрын

    kzread.info/dron/cvrowWWzbIIErU164UAtgQ.html

  • @chaitanya-varu
    @chaitanya-varu Жыл бұрын

    thank you! very helpful video

  • @bhaskarroychoudhury7911
    @bhaskarroychoudhury7911 Жыл бұрын

    Thank you very much!!!

  • @maniac1441
    @maniac1441 Жыл бұрын

    getting error "Gmail_API: Recipient address required"

  • @riteshbhadana
    @riteshbhadanaАй бұрын

    When I am sending mail, I am not getting the name and email, I am getting the message, what happened

  • @adediransulyman6103
    @adediransulyman6103 Жыл бұрын

    Thank you But please how do I go about it that after sending the mail it refresh the contact input

  • @umanggoel5385
    @umanggoel5385 Жыл бұрын

    how do you style the email ? What if I want the email to look attractive and fancy

  • @nileetsavale1871
    @nileetsavale18712 ай бұрын

    i am encoupntering an error for no reason, the task is always failing, if someone can help please let me know(ps: I am coding in react itself for my portfolio website)

  • @issameddinebouhoush115
    @issameddinebouhoush115 Жыл бұрын

    Hello, how I can send default values during the first reload of the component plz?

  • @sulemanmughal5397
    @sulemanmughal5397 Жыл бұрын

    i love ur portfolio bro...

  • @shakilahmed6870
    @shakilahmed6870 Жыл бұрын

    But it is sending me email from my email to my email. Like the sender and the receiver email remains same. So the email sender cannot see any sent emails to their inbox. Why this happening?

  • @user-ye7jq9iz4k
    @user-ye7jq9iz4k4 күн бұрын

    I always got public key is invalid. I have follow all instructions actually

  • @iafofkhadze4628
    @iafofkhadze4628 Жыл бұрын

    such a great video

  • @ChaooCharles

    @ChaooCharles

    Жыл бұрын

    You're welcome 😊

  • @user-jr6jk5xi5y
    @user-jr6jk5xi5y5 ай бұрын

    Where can I find styled-components

  • @Icedanon
    @Icedanon Жыл бұрын

    many thanks good sir

  • @md.sheikhalnahian459
    @md.sheikhalnahian459 Жыл бұрын

    Thanks a lot for helping .

  • @evansuslovich3720
    @evansuslovich3720 Жыл бұрын

    Awesome video! Still works!

  • @ChaooCharles

    @ChaooCharles

    Жыл бұрын

    Awesome 👌

  • @ghofranedarragi5601
    @ghofranedarragi5601Ай бұрын

    thanks for tutorial

  • @denistavabilov3338
    @denistavabilov3338 Жыл бұрын

    THX! React Send email from contact form without server code Email.js

  • @techlightdev
    @techlightdev Жыл бұрын

    Thank you so helpful for me

  • @chiomaveronicaezezim1933
    @chiomaveronicaezezim19336 ай бұрын

    Thank you so much

  • @investandcyclecheap4890
    @investandcyclecheap4890 Жыл бұрын

    thanks for the tutorial. Does anyone know if this will work with Firebase hosting? Thanks