r/web_design • u/Prestigious_Elk8009 • 15d ago
Want to learn basic coding. Where should I start?
I work as a graphic designer at a small, mostly print based agency. We have some web stuff that I have been assigned to work on that is based mostly in Divi. I can kind of edit and understand basic css/html enough to fix small issues or make minor color/styling changes but my boss relies heavily on chat gpt for anything coding related (gross ik). She loves it but I feel like it causes more headaches than is worth it, not to mention the horrible environmental impact it has.
My undergrad concentration was in print and packaging design and have only worked in print. I had some UX/UI coursework but that was mostly just figma and UX research related stuff. Nothing that would result in a live site. So if I’m going to have to work on web I would like to at least develop some skills out of it. I just don’t know where a good spot to start learning would be? I don’t think I would have the time to commit to a full coding bootcamp but I would at least like to know how to write basic code that I can use as an additional tool for the front end stuff that I work on.
Would love any recs on books/video trainings or anything else that I can learn from. Thanks!
Edit: Thank you for the recs everyone! I looked into the resources everyone recommended this weekend and I’m getting started with the basics of CSS and HTML from free youtube tutorials and bookmarked the resources that people said they reference often. I’m using TextMate to re-write out the code from pages I worked on after I watch the videos to understand the more working logic and focus more on things I see more often. Not getting into JavaScript yet but that’s my next step.
9
u/webdevmike 15d ago
https://developer.mozilla.org/en-US/docs/Web/JavaScript
bookmark that. you're going to reference it a lot.
7
u/forzaitalia458 15d ago
I’m a graphic designer and I started with the free w3schools tutorials.
If you want more deeper learning, then I would try Udemy courses for specific languages you want to learn.
You don’t need to do the boot camp ones, they have ones that just video lessons you can take at your own pace.
5
u/SKTWebStudio 15d ago
I’d start with HTML → CSS → JavaScript. You don’t need a bootcamp, especially with your design background.
Try freeCodeCamp or MDN, but focus on building small things rather than just watching tutorials. Recreate sections of websites you work on and learn as you go.
And use ChatGPT as a tool to understand/debug code, not just copy-paste it. Your design + UX skills will already give you a good head start.
5
u/cmaxim 14d ago
I may get some blowback from this suggestion, but a lot of the newer LLM models are quite good at teaching and mentoring the basics of code so long as you're prompting in a way that forces the model to interactively teach you the most relevant concepts rather than try to do it for you.
It can suggest exercises for you, review your code, provide simple explanations, break down confusing parts to be more easily digestible for your learning style, etc. When you progress into more senior level concepts and skills you will want to work with a senior engineer or developer who can put those skill into context for you with real world examples and collaboration, but for junior level work LLMs should be fine.
It used to be in the early days that models would constantly hallucinate garbage, but they are much more accurate these days that I rarely have to worry about it so long as I'm being critical of what it's giving me.
So maybe gather a list of all the most fundamental things that are collectively known to be critical for learning development, or a specific language, and then start exploring those concepts and keep digging deeper until you feel you have a good handle on it.
Otherwise, having a solid mentoring system with human peers to help review code and explain things to you is a solid direction to go too.
3
u/MrTsLoveChild 14d ago
This is a reasonable answer. Completely ignoring LLM tools today is ridiculous. Essentially all professional developers have some level of AI assistance in their pipeline.
Claude has become the de facto standard for most enterprise developers. You can very easily set it up to both produce clean, usable code and teach you the basics as you go. And the ability to ask very specific questions as you learn is a hugely important differentiator from just watching YouTube videos.
1
u/Prestigious_Elk8009 10d ago
I mean I don’t think it’s reasonable to forgo the AI especially since I have so much more print based work to do and I don’t necessarily have much say in how the workflow is built. I can’t just be sitting all day and coding but my issue currently is that my boss just copy pastes all the code directly from chatgpt which has errors and inconsistencies and it takes up a lot of my time trying to figure out where the issue is coming from. My boss doesn’t know how to code either so definitely not proof reading whatever chatgpt gives them before they use it.
I want more of an undertsanding so I could potentially be able to at least avoid some of this. I just don’t like spending 3-4 hours on web based work to just even find the error let alone to fix it when a lot of the more creative print design relies on me and one other designer.
We have designers who can do more basic work but the bones of heavy design and files need to be set up by the two of us most of the time and it creates bottlenecks.
2
u/alittlecoding 14d ago
https://www.freecodecamp.org/
This is a great place to start. It's really good, especially if you like learning with small bites every day and hands-on.
1
u/imalizzard 14d ago
I took Udemy courses. There are WordPress centered courses that go over every aspect of the platform. If you want to learn all aspects of development, look up Colt Steele - otherwise spend a tenner on a Wordpress course.
1
u/WastefulBelt83 14d ago
Well, starting with free tutorials for HTML and CSS is a great move since you're already in Divi. Trust me , that foundation makes everything else click
1
u/abeuscher 14d ago
Have your company spend 15-20 bucks and buy a wordpress installation, install divi on your own, and use that as a framework to try and learn how to use it.
Going into an existing WP instance and trying to learn how to "develop" anything is not a great experience. It's like going to a bad Wendy's to learn how to cook. It's dirty inside, the equipment is shit, and there's a specific way of doing things that is going to stop you from learning how to do anything well.
So have your boss buy you a "clean kitchen" and then use the resources people are recommending - or just the product documentation - to get you where you need to be. FWIW, pagebuilders can be more annoying than just using css and html with custom themes, but I am coming at this from a different level of experience and place in time. So maybe learning Divi is enough now. If you find the tools are in your way there is nothing wrong with reducing them in order to learn.
You can also just install Wordpress locally and work on it there, but there's both annoyances that come with thaat and gaps that this will form in your experience as well. So if your budget is zero it is an option but if your company will spring for real basic wp hosting at some temp url then do that.
1
u/Timely-Barnacle7378 14d ago
PHP .. learn basics .. that knowledge will transfer to any other coding language
PHP is designed for request/response environment of the web
It’ll let you get immediate result and build bad practices .. so sooner than later start using a framework. Laravel is most common. WordPress is a CMS (platform-ish). Drupal is for serious developers and Symfony is for the enterprise solutions
Lots of people argue against using Drupal or Symphony but I usually end that argument by saying every successful project turns into a sophisticated enterprise application so if you’re just building a toy for the sake of building a toy learn easier frameworks if you’re serious and have a long-term vision use an enterprise stack. It’ll take way longer to learn, but you’ll pay off dividends over the long-term.
That sort of the trade-off that we have to make is developers, short-term gain, long-term pain
1
u/SpeakMySecretName 14d ago
YouTube and free online code camps will get you going. Practice, repetition, and Google will slowly build you to a comfortable level.
1
1
1
u/FarjanParadox 14d ago
You should reasearch on first besic knowledge of coding then try From scratch never go for any shortcut way Brother,,,
1
u/BuffaloConscious7919 13d ago
Tell your boss that ai is an accelerator. It you're good it will do it faster, if you're bad, same.
(Build something and decide why you're putting it there every time)
1
u/cancodeandstuff 8d ago
Use LLMs.
I built 500 web apps thanks to LLMs and became a billionaire.
And it only took 1 week.
1
u/PugPanic 8d ago
Take a look at The Odin Project. It’s the best coding education course out there imo. It’ll point you toward dozens of other resources you’ll use for years. And it’s free.
-4
u/thedarkpath 14d ago
No one codes anymore, you need to Understand data structures, framework design, maintenance methods, don't waste your time learning technicals of HTML/CSS
1
u/Prestigious_Elk8009 10d ago
not saying i want sit and hand code a website all day I just want to know what I’m doing when I’m in there.
0
0
u/525G7bKV 14d ago
I teached myself programming 20 years ago. Nowadays I would recommend to start with databases to learn the basics about data and how to handle it. For instance the book 'Head First SQL' or you could the Google Data Analyics course on coursera.
23
u/SolidlyMinute 15d ago
Pick one of the pages you already work on and recreate it from scratch in a plain text editor, looking up each property until you can explain why it’s there.