Deploy your react+vite app in 3 EASY STEPS

  Рет қаралды 60,358

Programming with Mist

Programming with Mist

Күн бұрын

In this video we deploy our react and vite apps to Netlify in 3 simple steps using the vite build command

Пікірлер: 129
@niquebon
@niquebon Жыл бұрын
Straight to the point! It's quite hard to find a tutorial that does not go straight to the point. Thanks so much!
@UECSoumyaRay
@UECSoumyaRay 7 ай бұрын
Thanks man!!! I am a beginner. Didn't know that you have to do the npm run build command to make the dist folder. I was banging my head for so long!!! Much appreciated.
@iamtharunraj
@iamtharunraj Жыл бұрын
This video is so underrated! I could find exactly what I wanted. Thanks man! You're awesome!
@horrid13
@horrid13 Жыл бұрын
every other tutorial made a fuss and complicated it! straight to the point thanks
@adekolaadelana2384
@adekolaadelana2384 Жыл бұрын
Mehn! you are the best. It is only a matter of time bro. You have got the content itself. All other tutorials out there are just not nailing it. But you did! You know I love you and your tutorials because it always comes out best for me particularly. You just got a new follower. and a mentee😁
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
it worked? for me its just showing a blank site at the end.
@yhbarve
@yhbarve Жыл бұрын
@@akshanshkaushal9422 You must have uploaded the entire project. Just upload the 'dist' folder. Lemme know if that helped
@Yuki-vt
@Yuki-vt 3 ай бұрын
thank you very much, i done with my project to graduated
@setgramofficial6703
@setgramofficial6703 Жыл бұрын
You’re the best….Something I have been struggling since can be this easy…thanks
@stormshadow76
@stormshadow76 Жыл бұрын
Thanks Bro .. This is the easiestttttttttttt wayyyyyy .... Straight to the point !!!
@tommylin432
@tommylin432 Жыл бұрын
Tommy from scrimba discord here, loved the tutorial, very easy and fast, you earned my sub Mist keep up the great work much love from new york
@jonasoo7113
@jonasoo7113 Жыл бұрын
omgggggg i did not run npm run build command.... that's why i can't get it done... thank you you have saved my day!!!! and very nice voice btw !!
@WorkExcel-tn8ub
@WorkExcel-tn8ub 5 ай бұрын
oh my God you saved my career. thank you so much.
@Free_Bird78
@Free_Bird78 Жыл бұрын
what a legend - literally saved me you have no idea
@AbdiwadudMohamed-y4q
@AbdiwadudMohamed-y4q 10 ай бұрын
thank you very much, was struggling with this for a while
@felixa9667
@felixa9667 Жыл бұрын
simple, clear, short - thanks Sir!
@miguel83473g
@miguel83473g Жыл бұрын
It works!! Simple and effective, great job 👌👌
@luckyboy3802
@luckyboy3802 Жыл бұрын
Excellent !!! 🤩🤩🤩 it works exactly and so easy... like a dream, thank you very much.
@ashwinacharya293
@ashwinacharya293 Жыл бұрын
To the point!! Liked it 🤩
@TusharHambir
@TusharHambir 12 күн бұрын
Thank You So Much , Its Helps Alot
@harshadkumarpatel3341
@harshadkumarpatel3341 Жыл бұрын
Awesome! This tutorial helps me a lot.
@baderzaouich4201
@baderzaouich4201 11 ай бұрын
man I can't pass without saying thanks, you are great tnx
@lauraluo7242
@lauraluo7242 6 ай бұрын
this is so easy!!!!!!! perfect bro
@NaveedUlHaq75
@NaveedUlHaq75 7 күн бұрын
Welldone ! good Job ❤
@lorenzoaleixo5571
@lorenzoaleixo5571 4 ай бұрын
Hi from brazil, thanks dude
@theoappiah6373
@theoappiah6373 8 ай бұрын
I'm glad I found you.
@TheNationIsraelLives
@TheNationIsraelLives Жыл бұрын
Best developer video I have seen so far, it was so helpful and concise. Thank you so much for posting this!
@ismailista3237
@ismailista3237 9 ай бұрын
don't try to steal it
@remak6342
@remak6342 9 ай бұрын
hope you don't take his house
@yhbarve
@yhbarve Жыл бұрын
Thanks mate! To-the-point tutorial that was very helpful.
@vijayverma-dd7oe
@vijayverma-dd7oe 7 ай бұрын
it helped me a lot..exact content what i wanted to know
@muruga3603
@muruga3603 29 күн бұрын
Time Saving Bro😍
@fraternidadeaustriaca2625
@fraternidadeaustriaca2625 Жыл бұрын
thank you bro, simple and functional!
@MrBrady95
@MrBrady95 6 ай бұрын
Nice! Liked and subscribed.
@GuilhermePiedade-c4w
@GuilhermePiedade-c4w Жыл бұрын
Sou brasileiro e esse vídeo me ajudou muito, obrigado!
@pyyrr
@pyyrr Жыл бұрын
thanks. straight to the point 💯
@andreainvernizzi8510
@andreainvernizzi8510 11 ай бұрын
Thank you for this video, it's helpful!
@Zarakkahnn
@Zarakkahnn 4 ай бұрын
Thank you so much i got it now
@digitalfarms999
@digitalfarms999 10 ай бұрын
Very helpful. Thank you so much.
@Mkzay
@Mkzay Жыл бұрын
Damn! You’re a life saver!!
@tonyg5132
@tonyg5132 11 ай бұрын
This is only for front end.... it would be nice if you showed a way to do this having a root project folder which contains both the client and server inside as sub-directories. Importing my entire project makes the deployment fail.
@wazzighait5539
@wazzighait5539 8 ай бұрын
Hello bro! Do you know how I can achieve deploying ssr vite projects where the dist folder has both server and client side
@happylaughy2777
@happylaughy2777 Жыл бұрын
Thanks man , it was of huge help
@kim92se64
@kim92se64 Жыл бұрын
Yep, what a great Tutorial !!! awesome Regard from Pakistan
@simplyjs
@simplyjs Жыл бұрын
is it working
@stormshadow76
@stormshadow76 Жыл бұрын
@@simplyjs Yep perfect!!!!
@Zhu8690
@Zhu8690 8 ай бұрын
Actually a good video!
@Fantasy3DMorals
@Fantasy3DMorals 9 ай бұрын
Thank you 😊
@isaacaninta6551
@isaacaninta6551 Жыл бұрын
So simple and concise❤❤😊😊
@wajidtechs.
@wajidtechs. 2 ай бұрын
you are awsome dude
@darlansantoscarvalho6619
@darlansantoscarvalho6619 Жыл бұрын
Oh man, that saved me, god bless u
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
it worked? for me its just showing a blank site at the end.
@marsdwarf
@marsdwarf Жыл бұрын
Nice tutorial, thanks for posting it.
@roshanbhagat3994
@roshanbhagat3994 8 ай бұрын
Thank you so much bro
@laurenmj90
@laurenmj90 11 ай бұрын
Awesome! Just what I needed! When we update the site, do updates automatically go through? Or do we need to run npm build again?
@programmingwithmist3897
@programmingwithmist3897 11 ай бұрын
With this method, you will need to run the build command and drag'n'drop the new dist folder into Netlify each time you make changes to the code.
@astasori6896
@astasori6896 Жыл бұрын
Dude u saved me, thanks a lot
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
it worked? for me its just showing a blank site at the end.
@royfrias4379
@royfrias4379 Ай бұрын
how about if the project has a back end how would can you do that ?
@Pedro-oq5cl
@Pedro-oq5cl 10 ай бұрын
Obrigado, amigo! Você explica muito bem!
@LENNOX40w
@LENNOX40w 10 ай бұрын
Thank you!
@subaruLover475
@subaruLover475 11 ай бұрын
Thank you!
@wazzighait5539
@wazzighait5539 8 ай бұрын
This is nice. But how can I do the same for a ssr vite project where the dist folder has both client and server side? Please I need help with this
@fengz-x7z
@fengz-x7z 5 ай бұрын
It seems like the vite package is not installed in your project or globally on your system. You can install it locally in your project or globally. To install it locally in your project, navigate to your project directory in the terminal and run: npm install vite To install it globally, you can use: npm install -g create-vite After installing, try running npm run build again.
@anazodovanessa5323
@anazodovanessa5323 Жыл бұрын
Thank you for this.. Subscribing now... 😻
@matthewblasco4720
@matthewblasco4720 Жыл бұрын
Thank you for this! omg
@Arjun-oq1jz
@Arjun-oq1jz Жыл бұрын
Thank you mate!
@gabrielmarcosmendes3412
@gabrielmarcosmendes3412 2 ай бұрын
Is this works for hostinger deploy too?
@GunGod517
@GunGod517 Жыл бұрын
thanks, bro!!!!!!!!
@AnaSantos-gj2fh
@AnaSantos-gj2fh Жыл бұрын
Thank you so much. 😊
@mboe94
@mboe94 10 ай бұрын
Awesome vid, thanks bro. However when I try to do it, Netlify can't find my pictures. They are located in the same way as your "images" folder.
@dnjosh10
@dnjosh10 5 ай бұрын
After following all the instructions given on this page, I got a blank screen upon visiting the live page? Yet building and deployment were done successfully as confirmed in the "Action" tab of the github repository
@uhhmike115
@uhhmike115 21 күн бұрын
same
@marcarce592
@marcarce592 14 күн бұрын
I’m getting a blank screen at the end after a successful deployment just dragging and dropping the “dist” folder in Netlify. Gonna try some different things Saturday when I get home to try and get this to work.
@mateussoares9688
@mateussoares9688 Жыл бұрын
great tutorial, thanks
@anazodovanessa5323
@anazodovanessa5323 Жыл бұрын
I have a question tho. I hope I'm attended to. If I want to make some changes after deploying it, what do I have to do? Thank you.
@TheMidnightillusion
@TheMidnightillusion Жыл бұрын
When deploying manually, anytime you make changes to the code you have to re-run the "npm run build" command to generate an up-to-date dist fold and drop it into netlify.
@johanesalberto6136
@johanesalberto6136 Жыл бұрын
thank you so much brother
@naveenalla3000
@naveenalla3000 Жыл бұрын
Super bro 🎉🎉🎉🎉🎉
@luiskingsleytolentino8291
@luiskingsleytolentino8291 10 ай бұрын
in my index.html, the assets can't be located because it needs dot before the file path, something like this "./assets/filename", note that I need to manually add that dot in the first
@Khalid-sr4zo
@Khalid-sr4zo Ай бұрын
i tried this, when i use npm run preview its working but when i deploy it or try to open it via live server or just double click on the html file i get a blank page. what could be the problem i am running in circles rn :s
@AdityaPatel-ji5kz
@AdityaPatel-ji5kz Жыл бұрын
After pointlessly trying to deploy on github pages and wasting so much time , deployed on netlify in minutes, Thanks
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
hi @AdityaPatel-ji5kz you deployed react+vite app? I have tried but when I open the final site it shows nothing. Could you help me to fix this?
@lorddinoff3714
@lorddinoff3714 2 ай бұрын
i have done the same thing but it gives me a blank website
@lorddinoff3714
@lorddinoff3714 2 ай бұрын
please help me
@ajanta28
@ajanta28 8 ай бұрын
netlify its not take a vite proxy what we do?
@andrew3581
@andrew3581 Жыл бұрын
mine just shows a blank page please help
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
same
@rehanahmad5401
@rehanahmad5401 Жыл бұрын
awesome thanks sir
@its_me_hb
@its_me_hb Жыл бұрын
Local Images not showing there
@tamerkhattab4013
@tamerkhattab4013 Жыл бұрын
thank you. im working on my portfolio and would like my project sites to be online.
@christianrodier3381
@christianrodier3381 Жыл бұрын
Super helpful
@Dev21262
@Dev21262 Жыл бұрын
Thanks! Man
@narekzalibekyan8805
@narekzalibekyan8805 Жыл бұрын
thanks!!!
@devanteswing701
@devanteswing701 Жыл бұрын
bruh you saved my ass thank you so much
@yashbhardwaj8419
@yashbhardwaj8419 7 ай бұрын
Thanku so much
@infofunmedia03
@infofunmedia03 Жыл бұрын
Thanks man
@hiteshsingh2548
@hiteshsingh2548 Жыл бұрын
Thanks bro👍👍
@purplekame1676
@purplekame1676 Жыл бұрын
nice, ty bro a lot, so ez
@ondrinurdiansyah9555
@ondrinurdiansyah9555 11 ай бұрын
hi, good video. but i want to upload my react js vite to ubuntu server, can you help me ?
@DevPortifolio2004
@DevPortifolio2004 Жыл бұрын
thank you so much
@matyghost1831
@matyghost1831 5 ай бұрын
nice
@devngecu
@devngecu Жыл бұрын
THe build index.html is blank.It is only opening with an http-server.How do we go around that?......Also firebase is not running the deployments.Please help
@SushilKumar-xh1dv
@SushilKumar-xh1dv Жыл бұрын
very helpful thankssss
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
it worked? for me its just showing a blank site at the end.
@AvikNayak_
@AvikNayak_ Жыл бұрын
to load resource: the server responded with a status of 404 (). i am getting this error on the console and the page is blank.what to do?
@snehashishghosh7258
@snehashishghosh7258 Жыл бұрын
have you figured it out?
@AvikNayak_
@AvikNayak_ Жыл бұрын
@@snehashishghosh7258 no haven't yet .if you find any solution kindly tell me.
@snehashishghosh7258
@snehashishghosh7258 Жыл бұрын
@@AvikNayak_ sure
@snehashishghosh7258
@snehashishghosh7258 Жыл бұрын
@@AvikNayak_ I installed the latest version of Node, deleted the node_modules and re install node_modules using 'npm i'.... This worked for me
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
@@snehashishghosh7258 which version did you used?
@hemantvardani1436
@hemantvardani1436 Жыл бұрын
Thanks
@yusufbachtiar2694
@yusufbachtiar2694 4 ай бұрын
THANKS
@Dira_1111
@Dira_1111 Жыл бұрын
Thank you so much
@akshanshkaushal9422
@akshanshkaushal9422 Жыл бұрын
it worked? for me its just showing a blank site at the end.
@carlosmario1060
@carlosmario1060 Жыл бұрын
Muchas gracias...
@yathishshettigar9344
@yathishshettigar9344 3 ай бұрын
Index.html file what I got after npm run build (.dist) folder, If I click on it, its just showing blank white screen whats the reason?
@ilhamsadik9680
@ilhamsadik9680 2 ай бұрын
Do you know what the reason is?
@euroclydon7883
@euroclydon7883 Жыл бұрын
You bi genius
@jhin7_s337
@jhin7_s337 6 ай бұрын
thanks
@ashharSartaj
@ashharSartaj Жыл бұрын
Thank you
@27sosite73
@27sosite73 Жыл бұрын
ty mate
@tanvirrana3433
@tanvirrana3433 Жыл бұрын
thanks
@ibereola
@ibereola Жыл бұрын
hii
The Best Way to Host & Deploy a React Application
11:00
JavaScript Mastery
Рет қаралды 249 М.
This UI component library is mind-blowing
8:23
Beyond Fireship
Рет қаралды 681 М.
pumpkins #shorts
00:39
Mr DegrEE
Рет қаралды 57 МЛН
Win This Dodgeball Game or DIE…
00:36
Alan Chikin Chow
Рет қаралды 40 МЛН
Life hack 😂 Watermelon magic box! #shorts by Leisi Crazy
00:17
Leisi Crazy
Рет қаралды 32 МЛН
An Unknown Ending💪
00:49
ISSEI / いっせい
Рет қаралды 57 МЛН
7 better ways to create a React app
7:08
Fireship
Рет қаралды 549 М.
Laravel vs Rails for Javascript developers
19:50
Sam Lewis
Рет қаралды 3,6 М.
Deploy Vite React App to GitHub Pages (2024)
3:07
Vladyslav Dihtiarenko
Рет қаралды 17 М.
The Value of Source Code
17:46
Philomatics
Рет қаралды 51 М.
How to Deploy Your Vite App to Github Pages
3:53
LearnVue
Рет қаралды 66 М.
Vite in 100 Seconds
2:29
Fireship
Рет қаралды 865 М.
Deploy Vite React App on GitHub in 5 Steps
4:52
React Learner
Рет қаралды 6 М.
pumpkins #shorts
00:39
Mr DegrEE
Рет қаралды 57 МЛН