Learning frontend web development with ChatGPT

Code Help HTML/CSS/JS
1

Hey community,

I recently signed up for an online frontend eng course and am working through it with the help of ChatGPT. I’ve taken a Python course in the past and played around with JavaScript so I’m broadly familiar with writing code.

The goal is to use AI to accelerate my learning and to abstract away some of the details of coding (i.e. writing code / syntax) so that I can focus on things like concepts and application of concepts (e.g. using semantic HTML + CSS to better structure my code; using lists instead of div blocks as a way of presenting content). One key objective is to develop frontend development “expertise” faster without getting bogged down on the details.

I think this is possible but am unsure how much of the details I can abstract away. So far, I’ve completed most of the HTML / CSS part of the course and am in the process of experimenting with prompts so that it can generate increasingly sophisticated websites. If I can build something similar to the Hubspot website, that’d be great.

The prompts tend to be very specific (e.g. In the first paragraph, turn ‘NYFW’ into a link and have it go to: New York Fashion Week - Wikipedia. Make sure to include the target=“_blank” attribute so that it opens in a new page). I’m trying to figure out how to get one or a few levels above this.

I’m looking for people in this community that I can collaborate with on this experiment. I’m a top down thinker and given that I’m new to frontend development, it’s hard for me to put together a high level approach for this experiment.

It would be helpful to chat with others, ideally a few folks with moderate frontend dev experience, as well as others that are starting out for the first time, to see how this all pans out.

Is there any interest?

2

This is very interesting, my experience with ChatGPT is it’s only really helpful with the basics, beyond that you really do have to know what you’re doing.

3 Likes
3

Also sometimes ChatGPT gives code with error
So beware of it

2 Likes
4

Yeah, I’m mindful of this and have asked around. At a high level, I’ve been told that I still need to understand how the plumbing works (at a minimum). I suspect I’ll need to learn how (e.g. elements) work so that I can better direct ChatGPT.

My experiments to date indicate that the more abstract I am with the prompt, the poorer the quality of the output code.

Regardless, given its continued advances, it’d be interesting to push this forward to see how far it can go.

Happy to start a small public discussion on this thread and post my experimental prompts and results if there is a small group willing to collab on this

1 Like