My journey into web development started over 20 years ago, when hiring a developer simply wasn’t an option. I couldn’t afford to outsource the work — so I decided to learn how to build a website myself.

Back then, online resources were scarce. Drag-and-drop website builders existed, but I wanted more than just a quick fix — I wanted to understand how websites really worked, from the inside out.

As a self-taught web developer, I started with the fundamentals: HTML, then JavaScript, and later PHP. The road wasn’t easy. I hit roadblocks. I got frustrated. I gave up — more than once. But I always came back, driven by the desire to create something real.

If you’re just starting your own journey, or you never had the chance to study web development in school, this page is here to help. I’ll share everything I’ve learned — and continue to learn — so you can build your skills and confidence from day one.

1. You (the Client!) also known as the stake holder.

You bring the vision—what the site should do and who it’s for.

2. UX/UI Designer

These folks design how the site feels and looks. UX handles the flow and experience; UI makes it visually appealing.

There are some great free online resources for learning UX/UI design — from beginner-friendly to more advanced. Here are some standout options:

---

🔹 Google UX Design Certificate (via Coursera)

• URL: coursera.org/google-ux-design
• Cost: Free to audit (or low-cost if you want the certificate)
• Why it’s good: Created by Google, it’s beginner-friendly and covers the full UX design process — research, wireframes, prototyping, testing.

---

🔹 Interaction Design Foundation (IDF)

• URL: interaction-design.org
• Cost: Some free articles and resources, but full access requires membership
• Why it’s good: Deep-dive content, practical case studies, and a strong focus on both theory and real-world practice.

---

🔹 freeCodeCamp – Responsive Web Design & UX

• URL: freecodecamp.org
• Cost: 100% free though you will be asked to support their model.
• Why it’s good: Includes UI/UX basics in its responsive design courses, with hands-on HTML/CSS projects.
• You will need to freeCodeCamp, an AI and WC3Schools as well. freeCodeCamp doesn’t really offer the why clearly enough.

---

🔹 Adobe XD Ideas & Learn Platforms

• URL: xd.adobe.com/ideas
• Cost: Free
• Why it’s good: Articles, tutorials, and design inspiration straight from Adobe — great for visual design and prototyping skills.

---

🔹 UX Design Institute – Free UX Course

• URL: uxdesigninstitute.com
• Cost: Free intro course
• Why it’s good: Gives a solid overview of what UX design is, including career advice.

---

3. Front-End Developer

They take the design and turn it into a real website using HTML, CSS, and JavaScript. Everything users see and click on—they build it.

Becoming a front-end developer today isn’t about just slapping some text onto a page and changing a few colours. It’s a craft — a blend of logic and creativity, code and design. Whether you’re just starting or brushing up, here’s what it really takes to build beautiful, functional, and responsive websites in the modern web world.

HTML is your structural backbone. It defines the content and layout of your page. But it’s not just about <div>s and <p>s — understanding semantic HTML (like <article>, <section>, and <nav>) means your pages are not only well-organized but also accessible and search-engine friendly.

Then comes CSS, the art of styling. It controls colour, spacing, layout, and animations. Knowing how to use Flexbox and Grid lets you build responsive designs that work across devices — no matter the screen size.

And finally, JavaScript brings it all to life. Whether it’s dropdown menus, form validation, or interactive charts, JS is what makes your pages dynamic and user-friendly.

Modern front-end developers use more than just code editors. You’ll want to get comfortable with:

• Version control with Git – essential for tracking changes and working with teams
• Browser developer tools – your best friend when debugging layout or JavaScript issues
• npm or yarn – to manage project dependencies and install libraries

And when you’re ready to speed things up, learn tools like VS Code, Prettier, and Live Server to streamline your workflow.

Once you’re solid on the basics, dive into front-end frameworks. React is the industry favourite — letting you build apps with reusable components. Others like Vue, Svelte, or Next.js have their fans too.

On the styling side, Tailwind CSS and Bootstrap make rapid design possible with utility classes or prebuilt components. I use Bootstrap when the need arises.

These tools don’t replace the fundamentals — they build on them.

Being a good front-end developer isn’t just about writing clever code. You also need to:

• Understand UX and UI principles — layout, consistency, readability
• Be aware of web accessibility — making sites usable for everyone
• Learn the basics of SEO — structure, metadata, and performance affect how people find your site

Real users (and search engines) care about speed and reliability. That means learning:

• How to run performance audits (try Google Lighthouse)
• How to write basic tests with Jest or similar tools
• How to handle errors gracefully and debug effectively

Some of the most important skills in front-end development aren’t technical at all.

• Can you explain your ideas to someone non-technical?
• Can you keep learning when things don’t make sense right away?
• Can you find solutions on your own (or ask the right questions when you can’t)?

These are what make a coder great — not just good.

Front-end development is a journey. You’ll never “finish” learning — and that’s the fun of it. Whether you’re switching careers, building a passion project, or just curious about how the web works, the tools and knowledge are out there — and easier to access than ever.

So start where you are. Learn a little each day. And build something that makes you proud.

4. Back-End Developer

Handles what goes on behind the scenes—like databases, logins, and form submissions.

5. Content Writer

Writes the words your visitors will read—headlines, product info, blog posts, and calls to action.

6. SEO Specialist

Makes sure your site is search engine or Google-friendly so people can find it.

7. Graphic Designer

Creates the logo, icons, images, and branding elements. By the way, I created my Logo, it’s not copied or from an AI, it’s all mine.

8. Tester (QA)

Checks for bugs, broken links, and makes sure the site works on phones and tablets too.

9. Hosting & Domain Setup

Someone needs to launch the site, secure it, and keep it running. That’s the hosting and domain side. It’s worth remembering that you can host your won website but you will have to purchase a domain name, and make sure you’re doing the purchasing.

---

You don’t need a huge team—many of these roles overlap or can be handled by one person. But understanding the process helps you build smarter, faster, and with confidence.

---