How to export and host your webflow website, free!

  Рет қаралды 47,529

Greg Ortega

Greg Ortega

3 жыл бұрын

How do you export your website from webflow, and upload it to firebase?
If you have used firebase before, it can be very simple, but if you have not done it before, I will show you how on this video.
Webflow is a great tool, and I use it for some of my project, but if you have a simple website about you, that is not updated on a regular basis, why pay a monthly fee when you can export it and host it for free with Firebase.
Installing firebase tools in the terminal:
/ webflow-free-hosting-w...

Пікірлер: 146
@trifco-studio
@trifco-studio 2 жыл бұрын
Excellent! I was not aware that you can "take out" your website out of the Webflow's eco-system and host it yourself.
@jagokb
@jagokb 3 жыл бұрын
You are so under rated good job
@gregortega
@gregortega 3 жыл бұрын
Thank you Jago :)
@youness_daoudi
@youness_daoudi Жыл бұрын
I was looking for this kind of video for a long time Thank you Grego for sharing
@ThomasGrantMacDonald
@ThomasGrantMacDonald 9 ай бұрын
It would be cool to see a process for exporting a design from Webflow to be built in a Client's Wordpress or Wix account
@pi-growth
@pi-growth 2 жыл бұрын
Thanks for the tutorial Greg
@keithhill3034
@keithhill3034 Жыл бұрын
Nice. 👍- Quality content 👍- No presenter head blocking content 👍- No jibber jabber 👎- Unfortunate/ distracting background “music”
@jean-huguesdoumbe6994
@jean-huguesdoumbe6994 Жыл бұрын
Thanks a lot
@felicityeku
@felicityeku 2 жыл бұрын
This is amazing! You need to have more subscribers
@stnayem
@stnayem 3 жыл бұрын
SUBSCRIBED. All others channels just teaching for pay money for hosting in Webflow (sponsored video maybe). Thanks a lot. This video was amazing and informative.
@gregortega
@gregortega 3 жыл бұрын
Thank you Nayem, glad you found it helpful :)
@dilhana7519
@dilhana7519 2 жыл бұрын
Thanks for this!
@franciscogutierrezramirez5497
@franciscogutierrezramirez5497 2 жыл бұрын
Thank you! It actually works :) I've noticed that some things didn't successfully transfer over like things dealing with CMS, but no problem, I can just delete that stuff
@gregortega
@gregortega 2 жыл бұрын
No worries :) yep there is no CMS functionality in this type of website.
@letasmr5676
@letasmr5676 2 жыл бұрын
dude this is gold, thanks!
@curiositytube5924
@curiositytube5924 2 жыл бұрын
Wow you are wayy too underrated. Keep up the good work!!
@tommallen7073
@tommallen7073 2 жыл бұрын
Thank you Greg!
@gregortega
@gregortega 2 жыл бұрын
You’re very welcome :) I’m planning to make a video on making a blogging website for free, using Hugo, and easy to maintain, but haven’t had the time. Hopefully in October.
@tommallen7073
@tommallen7073 2 жыл бұрын
@@gregortega I'm looking forward to it!
@arunprassath3136
@arunprassath3136 2 жыл бұрын
You deserve more sub.. Great content bro!!
@gregortega
@gregortega 2 жыл бұрын
thanks so much!, hoping to make more content on different nocode tools soon.
@juancarlosjimenez407
@juancarlosjimenez407 3 жыл бұрын
Thanks Greg
@cyrohan21
@cyrohan21 2 жыл бұрын
Awesome!
@omnishin
@omnishin 2 жыл бұрын
cool thanks man
@phillip76
@phillip76 3 жыл бұрын
Very nice.
@dilhana7519
@dilhana7519 2 жыл бұрын
absolutely insane my golly
@maumejean
@maumejean 2 жыл бұрын
252 subscribers? Give it time , you are good!
@abdi646
@abdi646 3 жыл бұрын
Love the video
@gregortega
@gregortega 3 жыл бұрын
Thank you! :)
@foxsportlive3268
@foxsportlive3268 3 жыл бұрын
Love this video. From Pakistan
@gregortega
@gregortega 3 жыл бұрын
Thank you!
@ThomasGrantMacDonald
@ThomasGrantMacDonald 9 ай бұрын
I'm a Webflow developer, this is awesome! I'm going to try it with some portfolio project websites. But for my own website, I think I like to do updates on it at least once a month. In this case, does it still make sense to pay for an annual Webflow hosting plan?
@katsuji0
@katsuji0 Жыл бұрын
Thank you so much for the tutorial, Greg! Just wondering if the design will also be responsive (mobile, desktop, tablet)?
@r4rama
@r4rama Жыл бұрын
responsive design is a media query, which is already included in the css code.
@MK-ef9iu
@MK-ef9iu 3 жыл бұрын
Good video Quality :)
@gregortega
@gregortega 3 жыл бұрын
Thanks so much :)
@InaAgapito
@InaAgapito 3 жыл бұрын
Thank u for share It❤️
@jatinkukreja18
@jatinkukreja18 Жыл бұрын
Will the background videos work in the exported site?
@rachitpant3357
@rachitpant3357 3 жыл бұрын
Thanks for the wonderful video. What does the js folder includes. Does it incldue anything other than animations.
@rachitpant3357
@rachitpant3357 3 жыл бұрын
Also if you dont mind can you opensource one of your webflow exports ( anything would work) . I just want to basically look at the what really is in the different folders. Also if you have a multipage project. Do you need to export each page individually. In that page would each page have a copy of the global css.
@gregortega
@gregortega 3 жыл бұрын
Hi Rachit, good question. I am not sure, I just had a look at the JS folder, and to be honest Im not sure what is in there, it looks like something specific to webflow. Depending on the project you might or might not need it. I tried removing it locally, and the index.html still opened fine, but I would not recommend removing it from a published website.
@gregortega
@gregortega 3 жыл бұрын
I just saw your second question, sure. Give me a couple of days and ill create a github repository with the exported site. About the multi page, if they are not dynamic pages they should be exported with the single export, I don't have a multi page website to export atm.
@gregortega
@gregortega 3 жыл бұрын
Hi Rachit, I've uploaded the exported code to a github repo if you want to have a look. This is before the firebase step. It contains pages that came with the webflow template, but are not in use. github.com/Gregortega/personal-website
@rachitpant3357
@rachitpant3357 3 жыл бұрын
@@gregortega Thank you so much 🙏
@radeneki
@radeneki Жыл бұрын
this is dope! cool alternative... is the animation i made on webflow can works properly?
@gregortega
@gregortega Жыл бұрын
You would have to try this first by downloading the code. I would expect most animations to still work :)
@xavierf2229
@xavierf2229 2 жыл бұрын
Thank you 🙏🏻 does this work also with e-commerce with photo animation?
@gregortega
@gregortega 2 жыл бұрын
Apologies for the late reply. No, this is meant to be for static sites only.
@xavierf2229
@xavierf2229 2 жыл бұрын
@@gregortega do you know anyway I could do that?
@gregortega
@gregortega 2 жыл бұрын
Hey Xavier, no. But I would not recommend running something like this for e-commerce. If you’re running a store you should definitely be on a subscription
@georgy.design
@georgy.design 3 жыл бұрын
Thanks for the tutorial, Greg! First of all, is there a way to upload the files directly to Firebase bypassing the terminal usage? Second, is it necessary to keep files on a computer? Can I just remove the folder? If yes, then is it okay to press “delete” or there is some sort of unlinking process involved? Third, how to update the contents of a website? Let’s say, I want to add a new page or fix mistakes in the text - what should I do? If I need to download the custom code from Webflow’s project then change the contents of the folder with newer ones, then what should one do if he/she deleted the folder (the second question)? I guess it will be a pain in the arse. P.S: I love your camera setup! Color grading is on point. Though, you look quite tired, mate.
@gregortega
@gregortega 3 жыл бұрын
Hi Georgy!, thank you! to answer your questions No, there is no way to upload the files to firebase directly without using terminal. Not that I know of. As for the delete, you can, the webflow project will remain in webflow, but you will not be able to export again if you don't have a subscription at a later time. I would recommend, using github for source control if you plan to update the website manually without webflow. That way you can safely delete from your computer, as long as you have a copy of the project somewhere like github. Yeah updating things manually can get complicated, but is doable if you have a simple website, you can use something like VS code, or ATOM. You can always see the changes by double clicking in the index.html file and seeing the local changes to the website in your browser Thanks mate, Im pretty happy with the setup, and yeah I needed to rest that day haha :D
@georgy.design
@georgy.design 3 жыл бұрын
@@gregortega I see, thanks a lot for the reply!
@jdcampolargo
@jdcampolargo Жыл бұрын
I'm using next.js as well as mdx for blog posts. How can you copy the code and then make it work within the typescript?
@gregortega
@gregortega Жыл бұрын
Hi Juan, apologies for the delayed response. If you're using next.js and mdx, then you're probably better off with your own solution and deploying to netlify or firebase. I don't think I understand your question 😓 but there is tutorials out there to help do this :)
@haieb
@haieb 3 жыл бұрын
I wonder how the performance is. Is it possible that you can do a speed test? For me it is important that the website is fast with optimal core web values and I was wondering if the code would run similarly on another host. Great video btw!
@gregortega
@gregortega 3 жыл бұрын
Thanks so much. I ran some speed tests, first one took 2.4 seconds loading from London, which is a lot but the again is free. Every other test shortly after that took between 200 and 600ms. Then I ran another test, from Japan and it took 1.86s. So it depends on where is the website being cached, and if it’s been cached before. The page size is 1.2 MB, and ran the tests with solarwinds pingdom. I have another website that is on webflow, as I need the CMS functionality, I might run some test on that later and compare but at the moment is not ready yet.
@haieb
@haieb 3 жыл бұрын
@@gregortega Thanks so much! Free is free and I might use that for pages where speed is not important. Keep it up!
@Ajourneycalledblessed
@Ajourneycalledblessed Жыл бұрын
Things got real messy when my client transferred to WordPress; my company lost integrity because of it. How'd it go for you?
@Dramko
@Dramko 2 жыл бұрын
Hi, Thank you very much for this great tutorial. Can you also add your webflow databases to firebase?
@gregortega
@gregortega 2 жыл бұрын
Hi Daphne, no unfortunately. This tutorial is for static websites that don’t have dynamic data, so it cannot cannot to webflow while being hosted elsewhere.
@JoseAntonioWriter
@JoseAntonioWriter 2 жыл бұрын
Hi. SORRY...BUT my terminal says "Error: Not in a Firebase app directory (could not locate firebase.json)" when I use the "firebase deploy" command. What Can I do? THANK YOU VERY MUCH! SO far, your instructions I was able to follow. Thank you!
@gregortega
@gregortega 2 жыл бұрын
Hi TopFive, Sorry for the late reply. You need to ensure the terminal is at the directory of the firebase project. You can check in the terminal in which directory you are currently in by entering "pwd". If you are not in the firebase project directory then you can change directories with the "cd" command and input the directory you want to change to.
@sykowhite9465
@sykowhite9465 3 жыл бұрын
what if i want to update something on the website or if i need cms dynamic content?
@gregortega
@gregortega 3 жыл бұрын
If you need to have a CMS I would not recommend doing this, it would not work. This only works for a static website, that does not require updates, for example, a CV or just a landing page about you or your business.
@denniszenanywhere
@denniszenanywhere 2 жыл бұрын
This is fantastic. Will it work if you have contact form? If so, Can you do another tutorial with contact form?
@gregortega
@gregortega 2 жыл бұрын
Hi Denniszen. Im not sure if this will work, if the contact form does not interact with webflow it should work fine. Think of it this way, if you embed the contact form without using webflow and the contact form just sends the info somewhere else it should be fine.
@denniszenanywhere
@denniszenanywhere 2 жыл бұрын
@@gregortega Thanks
@taneesescu
@taneesescu Жыл бұрын
how would one go about exporting the webflow code on pages + blog + cms collections to godaddy staging site on wordpress using divi theme? Webflow is great but we cannot use it for what we need.
@gregortega
@gregortega 11 ай бұрын
Oof I wish I could help but this is a bit too complex of a use case for how I normally use firebase hosting. You’ll need to have a look at godaddy staging site and how they handle a cms. You’ll probably need to transfer the data of the CMS manually or via the webflow + godaddy APIs. Sorry I can’t be much help here, good luck
@taneesescu
@taneesescu 11 ай бұрын
@@gregortega Ya im finding that to be the case. might need to rebuild it. i do appreciate you getting back to me. first amd only content creator to respond to my question. 🙌
@alexspranks437
@alexspranks437 2 жыл бұрын
If I have a blog and add new posts/ edit it, will it automatically change it while hosting it on firebase?
@gregortega
@gregortega Жыл бұрын
Hi Alex, you would need to re deploy the site for changes to take place
@cartermills3291
@cartermills3291 2 жыл бұрын
Does this work for websites made on Webflow using the e-commerce plans?
@gregortega
@gregortega 2 жыл бұрын
Unfortunately no. This is just for static sites.
@postnatalmotcoach1006
@postnatalmotcoach1006 3 жыл бұрын
What about back up . I have go daddy as a host with back up. But its going to cost £150 for so with everything. What do you suggest
@gregortega
@gregortega 2 жыл бұрын
Hi there, sorry but Im not familiar with goDaddy as a host provider, I have only used it for domain names :(
@belugaabs
@belugaabs 2 жыл бұрын
im using cargo for web builder, is it gonna work for cargo as well?
@gregortega
@gregortega Жыл бұрын
If you can download the code from cargo then yeah it should work, but check that the code runs first locally :)
@dikshitajain8583
@dikshitajain8583 Жыл бұрын
I didn't understood how coding terminal was opened any help is appreciated
@IAMCHIDERA
@IAMCHIDERA Жыл бұрын
Do I need to import the code from Wordpress to webflow tp make edits?
@gregortega
@gregortega Жыл бұрын
This tutorial is not for Wordpress, I don't know much about Wordpress
@LARESCIV
@LARESCIV 2 жыл бұрын
What's current cheapest/minimal cost for to be eligible to export your already made site in webflow, like what's the exact name of the deal/paid package, anyone knows?
@gregortega
@gregortega 2 жыл бұрын
You can look it up on the pricing page when you expand on the feature look for code export. It’s Core plan I think
@yapyh2872
@yapyh2872 Жыл бұрын
hey buddy, does firebase charge when there are many visitors?
@gregortega
@gregortega 11 ай бұрын
It depends on your use case, the free plan covers up to 10gb of storage and 360Mb data transfer a day
@TrendRain
@TrendRain 3 ай бұрын
It breaks if the website has CMS collection.
@mdabullais2114
@mdabullais2114 2 жыл бұрын
Can we export complicated websites with some animations?
@gregortega
@gregortega 2 жыл бұрын
It depends on what you mean by complicated. This is meant for static websites only. Where there is no interaction with a server or database or cms. Animations should be ok tho, but best to check the code can run locally first :)
@rafinonato
@rafinonato 2 жыл бұрын
How can I import webflow CMS collections to an exported site?
@gregortega
@gregortega 2 жыл бұрын
Hi Rafi, this is not possible. This tutorial only works for static sites, so no CMS
@marekdorosewicz8365
@marekdorosewicz8365 2 жыл бұрын
I guess you can use Netlify CMS
@nakedtech1865
@nakedtech1865 2 жыл бұрын
This could work with E-Commerce websites?
@gregortega
@gregortega 2 жыл бұрын
Hi Chase, no unfortunately. This is only for a static website.
@shaswatasutradhar272
@shaswatasutradhar272 2 жыл бұрын
Hi, is there a way to export code and host my e-commerce website outside of webflow? I have real confusion regarding this. PLEASE HELP.
@gregortega
@gregortega 2 жыл бұрын
Hi Shaswata, this works only for static sites in webflow. It would not work for e commerce sites
@shaswatasutradhar272
@shaswatasutradhar272 2 жыл бұрын
@@gregortega Thankyou very much for the clarification sir. I hope your channel grows to millions this year.
@JordanStambaugh1
@JordanStambaugh1 Жыл бұрын
I think Udesly + GitHub + Netlify is a much better solution because you can still use CMS functionality and the forms still work.
@lifdaai6736
@lifdaai6736 Жыл бұрын
This does not work anymore? I need to pay to export my website? Just created a new account and website. "Upgrade your account plan to export your site"
@gregortega
@gregortega Жыл бұрын
Hi there, yeah that’s how it’s always been. This is so that you stop paying if you’re already in a subscription and don’t need to update the website frequently
@postnatalmotcoach1006
@postnatalmotcoach1006 3 жыл бұрын
Can i do this on my iPad Pro
@gregortega
@gregortega 2 жыл бұрын
No, unfortunately this is not possible from an iPad
@muaaznadeem2575
@muaaznadeem2575 Жыл бұрын
Can we delete the website that we made in webflow after exporting the code ?????
@gregortega
@gregortega Жыл бұрын
You can but I think you can simply downgrade the account instead of deleting the site. So that you don’t loose the project.
@kwamefrancis2912
@kwamefrancis2912 3 жыл бұрын
Does it retain the animations and interactions?
@gregortega
@gregortega 3 жыл бұрын
Hi Francis!. Yes it should retain this things, however I think if you have other things like mailing lists and sales it might not work. This is advice mainly for static websites.
@asiag.8324
@asiag.8324 2 жыл бұрын
has anyone tried to export the site and found the animations and interaction continue to work?
@SlightlyOddFilms
@SlightlyOddFilms 2 жыл бұрын
@@asiag.8324 yes they continue to work
@asiag.8324
@asiag.8324 2 жыл бұрын
Does this work with Dreamhost?
@gregortega
@gregortega 2 жыл бұрын
Hi Asia, I did not know about Dreamhost until now. Yes it should work as well since they focus on web hosting, but I don't know exactly how. Best to try before it is what you want to do before committing to anything. help.dreamhost.com/hc/en-us/articles/360003490852-Using-the-website-file-manager-in-the-panel
@jekoylearns
@jekoylearns 3 жыл бұрын
hi, new subscriber here! I just want to ask if it's real that you can unsub after purchase?
@gregortega
@gregortega 3 жыл бұрын
Hi Zoe, thanks for that. Yes, you can unsubscribe from web flow after exporting the code. I would recommend only doing so after you exporting the code and uploading it to firebase
@connerbaker5435
@connerbaker5435 3 жыл бұрын
Do forms still work with this method
@gregortega
@gregortega 3 жыл бұрын
I think this should still work if they are simple forms, no files or images, but I have not tried it myself. If you export the code, you can try it locally before deploying the website.
@foxsportlive3268
@foxsportlive3268 3 жыл бұрын
Sir tell me how we earn money from webflow without freelancing system..?? Sir can we sold our websites theme in different platform???
@gregortega
@gregortega 3 жыл бұрын
I’m not sure what you’re asking, I’ll be covering different no code tools in the future. You can potentially earn money by implementing different ideas with no code. As for selling theme, I’m sure there are videos about it, if not I’ll look into it . Thanks
@TrendosTopPicks
@TrendosTopPicks 22 күн бұрын
Can I hire you to build my website on Firebase?
@gregortega
@gregortega 22 күн бұрын
Thanks for the interest @TrendosTopPicks but I’m currently not doing any contracting
@saadrahman9679
@saadrahman9679 3 жыл бұрын
Hey how can I do it in windows?
@gregortega
@gregortega 3 жыл бұрын
Hi Saad, you should be able to follow the same instructions on Windows. Firebase has command line tools for most operating systems.
@choongching
@choongching 2 жыл бұрын
Webflow's GTM Team is not pleased to hear these?
@gregortega
@gregortega 2 жыл бұрын
they could always provide a more friendly way to do this, a different monetisation strategy for people that only use webflow a couple of times only when exporting the code for example : ) it would still be a win for them
@kunalbelamkar
@kunalbelamkar 2 жыл бұрын
does it upload videos as well?
@gregortega
@gregortega 2 жыл бұрын
I have not tried having a video file in the website, but It should work similar to photos, and the video would be uploaded along with your website. But I would recommend having an unlisted KZfaq video instead. Just use one of the webflow components to add it, you just need the KZfaq link
@kunalbelamkar
@kunalbelamkar 2 жыл бұрын
@@gregortega thanks!
@elisons91
@elisons91 2 жыл бұрын
Using Netlify for hosting is easier.
@gregortega
@gregortega 2 жыл бұрын
Yeah for sure. Thinking of making a video about that too :)
@asiag.8324
@asiag.8324 2 жыл бұрын
Has anyone exported the site and found the animations and interaction continue to work??
@dmwtp00
@dmwtp00 2 жыл бұрын
Yes it works fine
@dmwtp00
@dmwtp00 2 жыл бұрын
..
@dmwtp00
@dmwtp00 2 жыл бұрын
...
@dmwtp00
@dmwtp00 2 жыл бұрын
....
@dmwtp00
@dmwtp00 2 жыл бұрын
.....
@jayberceles
@jayberceles 3 жыл бұрын
I'm not paying monthly for hosting. I'm paying annualy. It is more convenient.
@sakisathan
@sakisathan Жыл бұрын
why you don't use Zilla and you use this stone age methode
@vasu9760
@vasu9760 3 жыл бұрын
Dude, add some energy in you, be more energetic :) stay happy man 🙌👍😀
@feramval
@feramval 2 жыл бұрын
Is this working if i have call scheduling built in my website?
@gregortega
@gregortega 2 жыл бұрын
Hey Resolve, thanks for the question. Unfortunately , I don't know how the integrations to third party APIs would work, so I would not recommend this just yet. It depends on the integration. If it is just a code snipped added to the site, it should be fine, but if the integration needs to interact some more with your web-flow account then probably no. If you can export the code already with your current account, you can always try it out before committing to it by downloading the code and trying it locally.
@feramval
@feramval 2 жыл бұрын
@@gregortega Thank you very much i will definitely look more into it. Great videos by the way keep up the good work💪
Why I switched to Framer from Webflow
12:17
Omar Farook | Building Tech Startups
Рет қаралды 147 М.
How to Host Webflow Sites for Free on Netlify
15:35
Ruairi McNicholas
Рет қаралды 15 М.
КАХА и Джин 2
00:36
К-Media
Рет қаралды 4 МЛН
100❤️ #shorts #construction #mizumayuuki
00:18
MY💝No War🤝
Рет қаралды 20 МЛН
When You Should and Shouldn’t Use Webflow
8:14
Flux Academy
Рет қаралды 200 М.
How to Host a FREE Website with Google Firebase
11:37
Tony Teaches Tech
Рет қаралды 91 М.
BEST Website Builder 2024 (My TOP Recommendation)
15:27
Metics Media
Рет қаралды 1,1 МЛН
How To Structure Websites Efficiently With Webflow
8:46
Flux Academy
Рет қаралды 145 М.
Pydantic is all you need: Jason Liu
17:55
AI Engineer
Рет қаралды 164 М.
Designers Are Leaving Webflow... Here's Why
4:46
Tim Gabe
Рет қаралды 186 М.
Firebase vs Supabase - I Built The Same App With Both
6:21
Your Average Tech Bro
Рет қаралды 86 М.
How To Sell Webflow Hosting To Clients
6:48
Flux Academy
Рет қаралды 21 М.
Now He’ll Never Leave😭
0:36
Peet Montzingo
Рет қаралды 42 МЛН
😳 КИНОТЕАТР в БАССЕЙНЕ !
0:15
Настя, это где?
Рет қаралды 2,3 МЛН