Web development requires a great deal of attention to detail, a lot of skill and know-how, and plenty of time. Fortunately, the leap in AI development has proved to be a big help, taking some of the burdens off developers and giving them the support they need to do their best work.
ChatGPT’s ability to understand natural language queries about coding and provide accurate, clear and concise answers makes it very easy to use, and developers can get near-instant responses as they work.
“ChatGPT is really useful for languages that employ logic,” says Riaan Pietersen, League Digital’s head of development, "Since HTML and CSS are languages that are used to describe and style information structure, the mileage on those languages isn’t great. With that said, GPT is able to pull together markup and CSS using prominent frameworks as a reference.
For backend languages and modern Javascript, GPT can cover a lot of ground really quickly to provide a good, solid base to start off with. It is especially helpful for getting run-of-the-mill tasks done really quickly.
Need a function that will generate a random number between a high and a low number or an optimised array shuffling function? It’ll take a few seconds to give it to you."
Automated testing
Automated testing is an essential part of web development, and making the most of it delivers a real competitive advantage. It not only saves the time and effort that would be required for manual testing, it helps to ensure that websites are free of bugs and other issues that would ruin the user experience, which simply wouldn’t do.
“In the last few years, as Javascript has risen as a full-stack language, so too has automated code testing grown in popularity,” says Pietersen, “GPT does a phenomenal job of writing test cases (or jests). You simply need to expose the AI to your code and it will figure out how to test your functions to see that they are returning the correct output.
These models have been so well trained that they can also suggest optimisations to code and they are exceptional at finding bugs in code. Other tasks include obfuscating code as well as deobfuscating code.
To give this a try, give GPT the following command:
"Generate a fisher-yates shuffle array for javascript and obfuscate the code and also give me the deobfuscated version.”
A problem-solving tool
“AI is also good for looking for things like code smells and erroneous patterns,” says Pietersen. “We’ve had this for a while in webdev in tools like SonarQube. The program will work through the code base and identify bad patterns and will then produce a report on where these are. And, in most cases, how it can be remedied or improved.
It’s also good at supplying sample code for new technologies. Let’s assume you need to build a solution in React, but you haven't used React before. You can now ask the AI to provide you with code samples on how to approach the work. You can also give it code in a framework you know and ask it to convert it to another framework’s implementation as a point of reference.”
To try this out, use the Fisher-Yates command above and then ask it:
How would I use the deobfuscated version in React?
Common problems arise all the time in web development, like browser compatibility issues and slow load times. ChatGPT can help to recognise these problems and suggest solutions, reducing the time normally required to identify them and look for a fix.
“Instead of pouring over a solution and spending countless hours writing the code for it, the AI will usually give you some good inspiration and a solid departure point,” says Pietersen. “If you are trying to write functionality that is common in webdev, you’ll probably get some on-point code from the AI.”
Enhancing overall efficiency
Pietersen says: “For AI to be useful, you have to be extremely clear in your instruction to the language model. It will generally use what it finds to be “common” or “best practice” in its responses. I haven't seen an implementation yet that can wireframe instructions properly or even generate interfaces that aren't extremely simple or downright hideous.
But it can help by suggesting colour palettes, improving user input text, figuring out whether or not user input is within a range of acceptable input, or any area that can be classified using the written word.
One thing that I employ GPT for regularly is writing regex commands. Regex is a really smart piece of technology that allows developers to target and pinpoint patterns in strings of information. As an example, let’s say I want to validate that an ID number a user has typed is a “valid” ID number. I would use regex to check for the patterns associated with an ID number as well as the length of the string that was input. It’s also useful for finding things like email addresses in text or anything that can be quantified as “a pattern”.
Another area is doing grunt work like writing commonly used HTML markup, javascript functions, or SQL queries containing numerous parameters.”
Embracing the future
“AI in development is here to stay, no doubt about it,” says Pietersen, “Development as a whole will probably morph into more of a “trainer of language models and consuming their output”-role over time. I also think that the way we approach software development will change even more in the next 10-20 years.
No-code and low-code tools are now more prolific than ever before and the concept of APIs is now well established. Since AI is all about that binary life, making these various elements speak to each other will become faster and simpler, favouring a “configuration over coding” approach. The downside is that everything will look and feel like everything else (homogenous), so brands that want to stand out from the crowd will need to figure out ways to harness the power and speed with the flair that they desire.
GPT can already be integrated with popular IDEs like VSCode. You simply install it as an add-on program to run within the development environment, from which you can then tap into the power of AI without switching windows. Down the line, we can probably expect more SaaS that will plug into the server side of operations to then work its magic on large data sets, generate reports, or even suggest updates and upgrades based on the knowledge that it is gathering from around the world.
Large CMS systems like Adobe’s Experience Manager are already employing AI in their marketing efforts, but it comes with a hefty price tag and is only really reserved for mega/global brands. As more developers embrace AI in their workflows, hopefully, it will also lead to cleaner, more standardised code.”
At League, we aren’t afraid to put emerging technology to work to help us do what we do and deliver to the highest standards possible – websites that amaze and delight users and deliver the results our clients are looking for. Take a look at how we can do that for your business.
