The One Where We Use Github CoPilot To Speed Up Development

How 8020 uses Github CoPilot to Speed Up Webflow Development

Why do we write code as a no-code agency?

If you are new to programming, no-code tools are the best place to start. Tools like Webflow, for instance, allow you to build and develop fully functioning digital products without writing a single line of code. Just like building with legos, by dragging and dropping components, you can create amazing applications and digital websites.

As a no-code studio, we are obviously strong supporters of no-code tech and tools. We build most of our websites with it. But, what happens when a client asks us specific requirements? Or when we need to implement complex custom solutions? Well, that's where having a basic understanding of any programming language comes in handy.

In some ways, no-code is a misnomer since there is plenty of code involved backstage. Using the Pareto principle as reference (you know we love it at 8020), no-code will take you 80% of the way there, but there is always that 20% of code needed to truly deliver excellent digital products. Hence, we no-coders must eventually understand the fundamentals of programming in order to be able to use, manage, debug and scale our skills effectively — especially for enterprise-level clients + builds.

We have found that knowing code is needed to:

1. Tackle bugs, without spending hours scuba diving for answers in StackOverflow.  
2. Leverage custom layouts, functions, and illustrations.
3. Create robust native apps.
4. Manage, clean, and migrate data.
5. Use custom code for popular Web integrations, like Greenhouse.
6. Increase speed, scalability, and security when managing higher-level projects.

After several years in the no-code biz, we now understand that if we want to excel, we need to complement our no-code tools using traditional development platforms (even if it seems counterintuitive). Thankfully, the spectrum of tools to help us code grows by the second. Today, we not only have no-code tools to help us no-coders speed up development but we also have Artificial Intelligence that is literally starting to write the code for us. So, in this episode of Insider, Coco and Matt share how 8020 uses an AI tool (Github CoPilot) to build Webflow websites with custom code faster and easier than ever.

How we started: Coding in the no-code setting

Disclaimer: We absolutely love Webflow, but just like every single no-code tool out there, there are some things that are beyond its capability. As a Webflow-focused no-code studio, we have firsthand experience with those limitations. Sometimes, requests we get from clients go beyond the native capabilities of Webflow, but we still want to be able to bring their idea to life on the platform. Luckily, most of our developers and team members at 8020 have some basic understanding of JavaScript. So, when a new project with custom code arises, we can often turn to each other to complement our skills and tackle the tasks.

We also used to spend hours on Stack Overflow to try to find answers to some of our development questions. And, sometimes, we even brought out the big guns and hired traditionally-trained Javascript freelancers to help us write the code we needed for a project.

In the beginning, these strategies were good enough to get us to the finish line. But, as we grew bigger as a no-code studio, we received more complex and code-intensive projects. Spending hours of research to figure out how to do it was neither time nor cost-effective for us or our clients. We wanted to make sure we were optimizing our processes. And so, in the search for resources to help us with it, we encountered our sidekick: An AI tool that would allow us to build custom code, without the need to be experts in dozens of programming languages: Github CoPilot.

Key takeaways:

• Working with no-code allows you to get an understanding of how software is built. However, if you want to create more complex or custom components, you will eventually face the reality that you need to write at least some code.
• Trying to write code when you just started learning can be very frustrating. You do not need to be an expert in a specific language, just knowing the logic behind them will get you a long way.

How we code now: Using AI to accelerate web development

What is CoPilot?

CoPilot is Github's AI that uses natural language prompts into coding suggestions across dozens of languages. It uses the OpenAI Codex to infer code and entire functions in real time, right from your editor. This means, that you can write a comment describing the logic you want to follow and CoPilot will immediately autocomplete the code to implement the solution. But more than that, it can analyze and predict your code based on past patterns of your code lines. Eureka! We found an easy, smooth way to build faster using custom code.

This tool has allowed our developers to spend less time typing repetitive code patterns or searching for answers, and more time doing what they actually love: building amazing websites.

For instance, here is an example of a Greenhouse-powered job board integration we built for a client. It had a very specific look, so we were unable to develop it using no-code tools only. With the help of CoPilot and some basic tweaks to the JavaScript it created, we were able to build with custom code the filters our client needed in a matter of minutes.

It's incredibly impressive to watch. If you don't believe us, you should go check one of 8020's best developers, Coco Vega using CoPilot live. Just go to min 10:45 and prepare to be surprised by the reach of this tool.

It is important to highlight that CoPilot can and will often make mistakes. That is why, unless you want to spend hours debugging, we insist that it is crucial to learn the basics of code. You can find a perfect example of this in the demo video min 10:45 when Coco was using the CSS property of "grid" instead of "flex" for the collection he was working on. At first glance, he immediately identified the error and fixed it. But, this was only possible because he had previous knowledge of JavaScript and knew exactly where to look for the mistake.

If Artificial intelligence gives you the heebie-jeebies, don't worry too much. CoPilot's skills are sensational, but this tool does not have the ability to think critically as we do. AI can mimic what it has seen retrospectively, but it does not have the power to think forward and create new ideas on its own. So, this won't unchain a Matrix scenario. And AI will not replace programmers anytime soon either. It will just take away the drudge work from manually writing lines of code, boosting your productivity.

Key takeaways:

• When delving deep into Webflow, Zapier, Airtable, or any no-code tool, it is a good idea to learn JavaScript. If you are a beginner, we recommend the Learn JavaScript YT video from JavaScript Tutorials to get you kickstarted.
• AI is allowing coders to do their daily work much faster. Tools such as CoPilot can help you find the baseline building blocks you need to create custom code, and even point you towards new ideas.  
• CoPilot is not always correct, but it is just close enough. We don't doubt that it will get more accurate in the future. But for now, it might need a little nudge from you to get your code just right.

AI precautions + recommendations

1. CoPilot is a like a speedboat. It has the power to take you to your destination rapidly. But, if you do not know how to sail it properly, you won't get too far.  
2. Learn the fundamentals of coding! You don't need to be a JavaScript expert, but you surely have to understand enough if you want to grow your capabilities as a freelancer or agency and be able to build more complex websites.
3. CoPilot might be controversial, for many reasons. One of the biggest pushback from coders is that it sometimes does not predict perfectly the code you want to create, even if simple. However, we have found that if you break down the lines of code into more granular problems, it has the potential to be more accurate and even get you cleaner, more performant code.
4. We see a bright future for AI in the no-code world. If CoPilot is able to work so well at a beta stage, just imagine how good it might get in 5 or even 10 years! We recommend starting sooner rather than later and getting a head start. AI might play a key role in the future of coding.

Key takeaways:

• You can be a very good developer by mastering no-code tools. But to be an excellent programmer we strongly recommend knowing the basics of code.
• Learning coding and programming languages will provide you with numerous business benefits — from getting better employment opportunities to providing a better service to your clients.
• Just keep swimming! Learning to code might be overwhelming for non-technical peeps. But you can learn the essentials one step and a time. Eventually, your hard work will pay off and will help you build digital products faster.

Stay tuned! The next episode of Insider comes out in two weeks. In the meantime, we would love to know: What tips and tricks do you use to speed up your development process? Share with us your tips and tricks here.

See you pronto, no-coder!

‍