Build and Deploy a React PWA - Why Progressive Web Apps are the Future of the Web

❗ IMPORTANT:
Become a PRO at JavaScript: bit.ly/MasterJavaScript
⭐Tabnine - www.tabnine.com/now?...
In this video, you're going to learn how to build a #PWA using #React. After the application is built, I'm going to show you how you can deploy it and also publish it to a special PWA store! We'll create custom service workers and use a JSON Manifest. Stay tuned!
Progressive Web Apps provide you with a unique opportunity to deliver a web experience your users will love. Using the latest web features to bring native-like capabilities and reliability, Progressive Web Apps allow what you build to be installed by anyone, anywhere, on any device with a single codebase.
Unfortunately, as of now, the founders of the PWA store closed their website. You'll still be able to code along with this video and do everything just fine! 😊
📧 Join our JavaScript Mastery's Newsletter on Web Development, JavaScript & React to get exclusive programming guides, tips & tricks, and entire e-books: resource.jsmastery.pro/newsle...
📚 Materials/References:
GitHub Code (feel free to give it a star ⭐) - github.com/adrianhajdin/proje...
All materials (API link, API key, image src link, offline.htm, App.css): gist.github.com/adrianhajdin/...
Logo.png: ibb.co/Y3yyW93
bg.jpg: ibb.co/7XgmzCw
💼 Business Inquiries: [e-mail]
🌎 Find Me Here:
Discord Group: / discord
Instagram: / javascriptmastery
Twitter: / js_mastery
BuyMeACoffe: www.buymeacoffee.com/JSMastery

[@chaitanyaj4877]

Converted the Ecommerce application developed by taking inspiration from one of your tutorials into a PWA. Thanks for taking time to create this content. Explanation about service workers was on point!

[@apoorvrajsharma2706]

This was simply on point. Nothing else to say. From development to deployment, without creating any confusions. Good job friend 👍.Thanks

[@javascriptmastery]

Thank you for such a nice comment! 😊

[@rpavanshetty]

And “Just Like That“ we’ve the PWA video. This was really cool and informative. Thank you.

[@javascriptmastery]

Glad you liked it!

[@dazeb]

The stuff you explain i have heard nobody else explain. How do you build and deploy an app easily? This guy explains it perfectly.

[@d00lph1n]

Nice tutorial, you are a really good teacher. I didn't know this could be done without using frameworks like React Native or other. :)

[@oscargalvez7]

I keep finding you videos when I look for new knowledg, so much learning I've done thanks to your channel. Thanks so much, Adrian!

[@showunmioludotun3538]

Wow!!! So I learnt and built a PWA in few hours "Just like that". You are really amazing

[@javascriptmastery]

Thank you! 🙌

[@randerins]

That must have been the best tutorial I've ever seen! THank you so much!

[@EbenezerDon]

This is amazing! Thanks for the effort you put into creating your videos. For anyone who's wondering, the theme is named "One Dark"

[@frederickchen1191]

I'm so amazed i could create a PWA in hours, installed in my own phone and interact with it !! Thankyou so so muchhh

[@javascriptmastery]

Glad you like it, great job!

[@pokerfaced8139]

this was whole lot of a different experience and i loved it. thank you

[@surfinbird71]

I cannot believe I did the whole tutorial, installed the app on my phone and everything works! Amazing tutorial.

[@javascriptmastery]

Amazing job!

[@manzimsoumik3748]

saw first time a PWA video, already motivated to convert all of my next projects in PWA

[@mmudit30]

I was really waiting for your video. I'll watch it by tomorrow and will wait for other video 😅. Thanks man.

[@javascriptmastery]

Thanks!

[@sameeravhad6266]

Wooowwww. Hey I am React js developer. And was looking for PWA good resource from last 7 8 month. And Today I reached at your channel. What a great video it is! Just one word Increadible. And you mentioned that PWA site was a Cherry on A Cake. Worth to subscribe your channel. Found good thing in Covid-19 lockdown time. Thank you soooo much

[@best_iyke]

Thanks so much for impacting my programming journey. You are an eye opener. Keep up with your good works.

[@javascriptmastery]

My pleasure!

[@bcdeveloperc6142]

now i want to add the interactive map feature and this would be a killer app. i've built a few of your projects and am in your discord. Now am working on adding my own independent features to make them even better. Thank you for helping me improve my skills homie. first time i've tried building PWAs. this was a great intro

[@javascriptmastery]

Awesom, thanks!

[@sahanavenkatesh3284]

I could not understand PWA better!! Thank you so much :)

[@aman.tyagi112]

love the fluency in your voice

[@javascriptmastery]

Appreciate it!

[@henryacosta3919]

Bro takes a thousand thanks. Very clear concepts, and lots of tools.

[@keshavsinghthakur3126]

Great Job!!, Thank you so much for maintain a very simplicity, while teach and teach from very basic. :)

[@javascriptmastery]

You're very welcome!

[@johnshanks9513]

So clear. Absolutely perfect. Thanks

[@sagar-tt4ub]

I have been reading articles on progressive web apps for almost 5 days now, finding a reliable source to learn how to make them. And finally, you upload a video regarding the same. My saviour!

[@javascriptmastery]

Glad to be here at just the right time!

[@sagar-tt4ub]

@@javascriptmastery Can you perhaps suggest a few resources from where I can learn more about progressive web apps

[@ivanrenedo9349]

Law of attraction

[@ivanrenedo9349]

@@sagar-tt4ub learn about workbox

[@sagar-tt4ub]

@Aravinthan Subramanian thanks a lot, man!

[@aseemmangla6649]

Great, Simple Tutorial, not confusing at all. Thanks a lot!!

[@awaisraza2285]

Man your tutorials are awesome

[@senkasim]

I will use Pwa in my next project. It was simpler than I thought. Thanks for your effort 🙏

[@javascriptmastery]

Most welcome 😊

[@ShivaniRaghavGaurish]

Awesome Tutorial. You covered so much within 1 hour

[@javascriptmastery]

Glad you think so!

[@ajitesh764]

Keep these videos coming, they are really very informative. God bless u with more subscribers this year.

[@MohamedAhmed-be7cz]

that's Amazing, honestly I like the video and I am so happy with result. it is the first time for me to do PWA and I feel like I understand everything, cuz you made it so easy and I like the way you explain. keep it up "__"

[@javascriptmastery]

Great to hear!

[@afirkaan100]

Great Tutorial! really appreciated your method of teaching. Clean cut!!! I know PWA now and looking forward to your other tutorial videos. Subscribed 🙂.

[@javascriptmastery]

Thank you, appreciate!

[@btech09csit]

Very Helpful content. Thanks dude lots of Love

[@isaactakiy7758]

I love this channel. JS mastery! You are really making me a pro. Thanks a lot and keep up with your good work.

[@javascriptmastery]

Glad you enjoy it!

[@OshadaDesilva7788]

Gorgeous presentation. Simple and sweet. Got everything on first watch. Thanks men

[@javascriptmastery]

Glad you liked it!

[@Murga_Mutton]

The best one I saw on PWA. Subscribed. Thank you.

[@huseinrezaei1847]

Thanks man, Thanks for every single minute you put on this tutorials to share with us on youtube :)

[@AquaticB]

Great stuff, as always. Actually learned some stuff apart from PWA. Keep up with great work!

[@javascriptmastery]

Thanks, will do!

[@aryanthakre4302]

Just amazing...! I really appreciate your work dude. Keep making such content👍🔥

[@javascriptmastery]

Appreciate it! 😊

[@mouhamaddiop1144]

The way you explain things is amazingly educational. Thanks a lot for what you do.

[@javascriptmastery]

Thank you, appreciate it!

[@CyberGenious24]

Great thank you very much for very simple to understand and apply tutorial . I am new to React and PWS this tutorial helped me to understand basic of PWA and react . Thanks a lot ! new to your channel subscribed !!!

[@AuxiliaryOfficial]

This is AWESOME!! I hope you make a todo list tutoria that sync data when it's connected to internet 🙏

[@prasanthmanimaran5158]

Simply superb! Thanks for this, brother. Stay blessed

[@kashmirtechtv2948]

Watched it completely. Will try an idea for sure

[@kashmirtechtv2948]

Wow man!!! Absolutely spot on❤️👌

[@subhadip98]

I love this tutorial, really amazing, thanks for making this video :)

[@piyushverma3485]

The best video on PWA with react. Loved it!

[@javascriptmastery]

Thank you!

[@jashimkhan3159]

Really it's appreciable !! Loved it.....Your tone was too much sharp and clear....

[@javascriptmastery]

Thanks!😊

[@Karthik-kt24]

LIFE SAVER YOU ARE!! Thankyouu soooo much

[@tomasgoldenberg1066]

congrats AdrianHajdin you are a very talented teacher and your content its like a engine of self improvment for us! keep on like this! keep on gaining subcribers and community , and build a course platform . your content is different than the rest of the tutorials or courses it is more.. complete , with all the deploy stuff have a nice day!

[@javascriptmastery]

Thank you Tomas for such a nice comment, appreciate it really much and I'm glad you're finding the value in the content that I produce. Have a nice day!

[@dev-_-nath]

Awsome. didnt know so many things were possible with react . Amazing video.

[@guilhermegirardi]

Nice one!!! Thank you very much!!!

[@JoeSulmar]

Terrific presentation for a "REACT/PWA Hello World". Clear and concise.

[@suryaguetta]

Thank you so much. Keep up the good work!!

[@parthrathore8656]

Thank you so much man!!! Really helpful video

[@TheUltimateDevAcademy]

I would like to sum everything up in one word - BRILLIANT!!!

[@javascriptmastery]

Thank you! Appreciate it!

[@TheUltimateDevAcademy]

JavaScript Mastery seriously man....as a creator I look up to achieving this quality in my video someday....really inspirational.

[@pablodelfante]

Thanks for the great video!

[@MuhammadAwais-nq9ss]

YoOoooooo man

[@zachwhite8054]

This is one of the best tutorials I have ever seen. Nice work.

[@javascriptmastery]

Wow, thanks!

[@adityapundir6529]

Amazing Bro, you're an amazing teacher! 🤩

[@sdplusm3]

Thank you for the video. This is a nice, simple, and informative one.

[@alexg7282]

So useful ! Thanks a lot and keep going ;)

[@animeshanandcool]

Loved it.thankyou so much

[@alexon2010]

Loved it, show, it could only continue, like for example: put it in the play store, in the apple store (I know it would be more complicated, but it could have something like that too) Congratulations !!!!!!!!!! - Brasil - Serra - Espirito Santo

[@javascriptmastery]

Great idea! :)

[@mohitsood1318]

Amazed by the power of Progressive Web Application.Very nicely explained Sir

[@JoaoVinicius-dr7ob]

Nice video, saved my work

[@vidit1001]

Very well explained., Thank you.

[@jonas-re4sk]

Excellent tutorial. Concise on what the objective is.

[@KhoaNguyen-mv2mu]

Thanks a million. Your teaching is awesome!

[@gigakvachakhia4777]

this is so great !. would love to see more of PWA

[@godsendmelied.5848]

Very helpful and simple to understand. Thanks a lot.

[@MaxProgramming]

I wanted this from you. Thanks. You have a great explanation

[@javascriptmastery]

Thanks!

[@veasnachea6924]

really nice help for start..., thanks.

[@jayakishore1234]

Great tutorial. Thank you, you helped me create my own Progressive Web app.

[@javascriptmastery]

Glad it helped!

[@vinaysharma642]

Thank you for making this

[@emileastih9006]

Great video, such a nice and clear course 👍👍👍

[@techhouse182]

Awesome simple on point. Thanks for this 👍 waiting for the same pwa many more 💪😊

[@willyhorizont8672]

Hope you always healthy, blessed, long life, thank you so much for free great tutorials 🙏

[@ashu_recitation]

Thanks a lot brother.Iam very heartful to thanks you bro

[@sohailsaha7427]

Thanks for the introduction

[@danieljulien4099]

really excellent and to the point! thank you

[@holgerst3655]

Thanks for the tutorial and the great explanations.

[@hasoali]

Awesome and clear, best one on the youtube.

[@javascriptmastery]

Wow, thanks!

[@dhamaradamsik8850]

You have talent to be a good teacher, your video is very informative Thanks sir 👍👍👍

[@nicklesseos]

this got it working after a bunch of other trys... ty good video a time stamp for service worker is needed though here you go 21:28

[@ehtishamtahir2187]

Hats off.... Best explanation.... U r the best teacher 💐

[@bisnissukses3735]

Its awesome... thanks,. I know this channel from telegram group.. this is first time i watch video in this channel but i love it. If in my country there are instructor like u, what a happy i am..

[@javascriptmastery]

Thanks and welcome

[@hardikmehta6198]

Nice video with React and PWA.Thanks

[@shezoo100]

First of all I must appreciate the awesome work you are doing and helping learners like myself to keep up with the new skills in demand. Secondly, can we have a tutorial of PWA with localstorage (e.g., sqlite) which synchronize with a cloud storage (e.g., mysql). Users are able to perform CRUD seamlessly offline/online. Whenever user goes online, the app syncs itself to the cloud storage. It will be good to see the handling of possible conflicts, as data generated by multiple users, syncs on multiple devices.

[@chanmyaemaung]

I'm waiting for your on coming videos until now. Now you could released a new tutorial. I'm very happy with that.

[@javascriptmastery]

It's here now, thank you! :)

[@chanmyaemaung]

I hope you can make a new tutorials what I requested last time which is about CRUD operations with using React and Firebase.

[@80Vikram]

Thanks for this amazing video, god bless you

[@javascriptmastery]

Glad you like it!

[@deejayche1]

really good tutorial thank you very much and keep them coming

[@javascriptmastery]

Thanks, will do!

[@tejasmandre666]

Thankyou soooooo much for making this ! I was able to integrate my django with react finally after watching this. Kudos Kudos Kudos !!! Other tutorials are soo confusing , this is like the most simple and precise explanation I've seen. Love from India. ❤️

[@javascriptmastery]

Amazing! 😊

[@hitesh99raj]

How amazing you are, That's why you called your channel "JavaScript Mastery", B'coz it's taught by the Master.

[@javascriptmastery]

Thanks!

[@hitesh99raj]

@@javascriptmastery Hi, One question why your create-react-app folder structure is different then mine. index.html is different and I didn't have offline.html in it.

[@bcdeveloperc6142]

heck yeah man his discord is fire as well

[@m..2694]

That's a really great video bro....hats off..

[@javascriptmastery]

Thanks ✌️

[@KaiBuskirk]

well done! I'm inspired! thank you!

[@javascriptmastery]

Awesome!

[@KaiBuskirk]

@@javascriptmastery you da man! cant wait to see more! kai

[@luisdelgado6051]

Amazing!! Thanks so much!

[@javidsadeghiashrafi2360]

It is an amazing tutorial. 👍

[@tejap463]

Thanks for the video, I felt like you could have explained more on the service worker file like what is fetch, active, install etc. Definitely, it is very helpful to get started.

[@javascriptmastery]

I agree, thanks!

[@cafe-con-leche]

service worker is still confusing to me but PWA looks really cool, thank you for tutorial!

[@javascriptmastery]

I agree. Thanks! 😊

[@alexpiano]

Thank you sir, I enjoyed this one :)

[@lookintomyeyes2681]

thq so much for the video , gr8 content

[@javascriptmastery]

Thank you!