How To Use Webflow Vscode, and GitHub Together For A Seamless Workflow
HTML-код
- Опубликовано: 11 июл 2024
- Unlock the full potential of your Webflow projects with our latest video: 'Seamless Integration: Webflow, VSCode & GitHub.'
Here is a step by step walk through to enhance your custom code workflow in Webflow.
We'll guide you through connecting Visual Studio Code and GitHub with Webflow, making your development process smoother and more efficient.
Perfect for Webflow users looking to streamline their coding and version control.
Don't miss out on these invaluable insights - watch now and transform your Webflow experience!
Here is a link to the blog post where you can access the code: www.clcreative.co/blog/how-to...
TimeStamps
00:00 Introduction
00:58 Getting Started
01:50 Add Folder to VSCode
02:18 Add Javascript File
03:32 Add Node.JS and NPM and Test
04:40 Initialize NPM
05:31 Update Package.JSON File
06:39 Add Parcel
07:37 Run NPM Start Command
07:59 Connect VSCode to Webflow
09:39 Check Connection to Webflow
10:24 Part 2 - GitHub Desktop
11:08 Create a Repository
13:32 Create GitIgnore file
14:23 Publish and Commit Repository
15:32 How GitHub Works with VSCode
17:00 Why use GitHub and Closing Thoughts
Here is a link to the blog post I mention in the video: www.clcreative.co/blog/how-to-connect-webflow-vscode-and-github-for-a-better-custom-code-workflow
When it comes to custom code and integration like this one, there are'nt much videos out there. Interesting material. Thanks and keep up the good work! 👌
Thank you. Glad you found it helpful.
This is great! Thanks for sharing.
A couple of things hat popup in my mind after watching it.
1. You can't serve constantly from your localhost, you will need to host it using cdn or something. Do you have a follow up video on that?
2. In this approach you don't bundle each time you make changes to the code (e.g. "npm run build") Would that affect the script? Or how to handle it?
:) Very good content! Cheers
Sorry for the late reply.
Yes, this method only allows you to serve the files locally. It is so you can develop faster with Webflow. Instead of publishing every time you want to see if a changed worked, you can hit save and see it on your site (you might have to reload), but that is much faster than having to publish to see if any changes worked in the code.
If I am understanding question 2, the bundling takes place when you run the initial start. It runs the build so you can run the local server. It will constantly serve any changes you have to the local server, which will show up on your website when you are developing using this method.
Very cool, if i want to serve my code through a CDN (JsDelivr or UNPKG) how could i do this?
yes, you would need to deliver your code through a CDN. I will need to make another video for this.
Thanks for watching!
I have seen that some people host their entire project and then import it to Webflow. This is done when there multiple JS files, instead of pasting them directly to Webflow. Is there any benefit for this?
You only get so many lines of code in Webflow. If your code exceeds the limit, you need to host it somewhere else - GitHub or another CDN. GitHub would be good for personal projects that don't get a lot of traffic. But for client projects or projects that get a lot of traffic, you would want to look into another CDN.
@@clcreativedallas thanks so much for the info. I’m new to Webflow and I wasn’t aware of any specific limitations with code.
You’re welcome
How about with CSS, is there a way?
I’m not sure there is a way. You might look into another online editor to help with that