ChatGPT: Idea to web app in 48 hours

ChatGPT: Idea to web app in 48 hours

Ok... "Idea to web app" in more like a week, but still! Not bad for someone who hasn't touched HTML/CSS/JavaScript in nearly 10 years.

It started as most good ideas start; a random conversation at the pub before going to a stadium rock show (yes, Arctic Monkeys at the Domain in Sydney were incredible)

Guess how many Spotify Monthly Listeners they have?!
OK OK, who has more: The Beatles or the Rolling Stones?
Reckon you could make a game out of this??

I'd been using ChatGPT quite a bit in the last month, but just for small things, just to test it out. This was the opportunity to give it a real problem to solve. My last-10 years have been more in the data science space and so my front-end skills were basically in the bin.

I warmed up ChatGPT with the concept first. From what I'd learnt so far, this was going to be important. I needed it on the same page as me so its suggestions and decisions had more chance of being relevant and correct. Then it was into getting some boiler-plate code from ChatGPT to start warming me up!

No alt text provided for this image











No alt text provided for this image












No alt text provided for this image


Within 20 minutes we had a prototype that looked roughly like what I had in mind.




Now it was onto figuring out how to host this... cheaply. ChatGPT suggested hosting on Google Cloud Storage as a simple and cheap option, noting the limitations of only being able to run client-side code. I was happy enough with this. ChatGPT seemed confident we could do this project with static web-pages.

We all know that the process of developing software involves A LOT of copy-paste-alter using stackoverflow;

A massive pro of ChatGPT is that the code it creates is perfectly relevant to *our* project. So there's much less altering required. Much less copy-pasta


No alt text provided for this image


We realised we needed to store some data and serve it via an API. The suggestion was to run a simple python Flask docker container in Google Cloud Run. Again, it would be cheap and simple. I needed a refresher on this part, and ChatGPT did this beautifully. Step by step instructions relevant to the context of what we are doing. When I got an error, it knew what the likely culprit was.


Whenever I didn't get something I could ask the question in the context of my problem, rather than having to unpack sorta-similar problems that other users have had with *their* projects from all over the Internet. This is a huge advantage!

I'd forgotten that developing websites can involve a lot of tinkering, especially with many devices to support (I must have repressed this memory; backwards compatibility with Internet Explorer 6 anyone? eww). This meant quite a lot of iterations. I was continually asking for small changes to layout and changing my mind on small aspects of design. This was a frustrating phase of the project, and its probably why I'm not a web-developer. It was interesting to note that I was relying less and less on ChatGPT as we went, however. The training-wheels were coming off. Look out Internet, I'm coding HTML again!

No alt text provided for this image



As more meat was getting applied to the bones a friend reminded me I probably need some terms and conditions and disclaimers. Good point.. "Hey ChatGPT..."

Will it hold up in a court of law? Let's hope I don't have to find out.





www.spotifyshowdown.com goes live!

No alt text provided for this image

It was a classic 80-20 rule project. The last 20% took me took me 80% of the time, but after 1 week I was confident enough in the product to buy a domain and send it into the world (for better or worse).

The name was one a few suggested by ChatGPT. And the logo created by Dall-e, which granted, could probably use a bit more polish.


Without ChatGPT this project idea would have ended at the pub. I would have thought about it, for sure. I certainly *could* have gotten the project done, but it would have taken much longer and looked far worse on the eye, which is one of the most important elements of project like this and well outside of my wheelhouse.

It was an incredibly rewarding journey for me and gave me a real sense of what developing software will be like in the coming years.

Learning HOW and WHEN to leverage AI for coding is going to be a crucial skill. There will be a balancing act about how much reliance we have on it. And there is no way to hide the fact that any decent web developer would look at my code and approach here and probably have heart-failure.

AI wont kill the need for good coders. It might have the unfortunate side-effect of sending a lot more bad code into the word... (Dreamweaver anyone?). But...

It shows how AI is helping lower the barrier for getting new ideas implemented and out into the world, which I think far outweighs any downside risks or issues
Stephen Mee

Part Time Test Engineer, Rally Car Builder/Engineer and Bike Rider.

11 个月

Did not use it for coding, but got it to write me a sponsorship proposal for motorsport. Wondering if I could ask it a question about self testing and how it identifies bugs within its own code.

回复
Cam Macaulay

Solutions Architect

1 年

Absolutely wild.

回复
Stephen Skehan

Analyst | Innovator | Designer | Strategist | Commercial Software Development

1 年

Great article mate. I was thinking of doing something similar for the experience. I love the explicit context of generated code. I also love the fact that it can be used as a brainstorming buddy to turbo boost your creativity! Awesome work!

回复
Ben Stewart

Development Team Lead at Phoenix HSL

1 年

Great article and love the app. Interesting times ahead!

要查看或添加评论,请登录

社区洞察

其他会员也浏览了