Ten years ago, web development was booming, and boot camps were popping up everywhere. I felt stuck in my digital marketing career and unsure of what to do next. SEO had become dull, and I wanted more creativity and more money. I had experience with WordPress websites and knew a bit of HTML, so I thought switching to web development would be easy. My motivations were money (75%) and the chance to be creative (25%), imagining cool projects I’d make. However, I didn’t really understand or respect programming and computer science.
I quickly learned HTML and CSS from Shay Howe and tried frameworks like Bootstrap. But I struggled a lot with JavaScript. Despite trying books, YouTube, and W3Schools, and even enrolling in Skillcrush. But even that didn’t click and I got so frustrated that I dropped out and got a refund. Eventually, I gave up on coding altogether. I switched to sales for three years before returning to marketing, focusing on email marketing and automation.
During this time, I worked in tech companies and got to know the engineering teams. I found everything about their work unappealing and realized coding was never for me.
Now, with ChatGPT and AI, I’m even more convinced that quitting coding was the right decision. What used to take months or years to learn can now be done in minutes with ChatGPT.
Temperature Converter
Prompting My Request
The instructions I gave ChatGPT:
“I want to create a temperature converter using HTML, CSS, and JavaScript. There should be a field for Fahrenheit and a field for Celsius, side by side. Below the labeled fields, there should be a button below them that says “Convert.” If there’s a number in the Fahrenheit field, there should be a number in the Celsius field and vice versa. If there are numbers in both fields or non-number characters (excluding decimal points), it should say “Error” below the conversion button.”
I then copied the code ChatGPT gave me into CodePen.
The Results
Refining My Request
Refining is key to getting better results with ChatGPT. I wanted a better converter so I got even more specific with my request.
The new instructions I gave ChatGPT:
“I want to create a temperature converter using HTML, CSS, and JavaScript.
There should be a title (in larger font) that says ‘Temperature Converter’. Below that, there should be ‘Fahrenheit’ (in bold blue font) with a field to the right for entering a number. Following this, there should be ‘Celsius’ (in bold blue font) with a similar number input field beside it. Below these, a black button with white text reading ‘Convert Now’ should be positioned. The entire layout should be enclosed within a thin black frame with a shadow.
If a number is entered in the Fahrenheit field, the Celsius field should automatically display the converted value and vice versa. If there are numbers in both fields or non-numeric characters (such as letters, special characters excluding decimal points), it should display ‘Error!’ (in bold red) below the conversion button.
Please provide me with the code for each of these three languages.”