jsn01000111 via blog

As someone who's still learning and exploring the world of web development, I recently started a really cool project: building my own web-based code editor! My goal was to create a place where I could write, edit, and learn HTML, CSS, and JavaScript right in my browser. Check it out in action here: Launch the Editor The best part? I’ve been using AI tools like ChatGPT and Gemini to help me build it – and it's been an amazing learning experience! This project is still a work in progress with lots of ideas for future updates, but many core features are already working and helping me learn faster. Phase 1: Getting Started with ChatGPT When I first thought about building a code editor, it felt overwhelming. That’s where ChatGPT came in—it was like having a personal tutor! With its help, I was able to set up: A responsive layout: So the editor looks good on both desktop and mobile devices. Syntax highlighting: Colorful, readable code for HTML, CSS, and Ja...

Ever wish you had a quick, simple way to test HTML, CSS, or JavaScript without launching a whole app or project? As I continue my journey into the exciting world of web development, I've been building some browser-based tools designed specifically for that! They're simple, free, and perfect for quick experiments and learning on the go. These tools are simple and great for beginners like me. I made them to test small pieces of code, play around, and learn as I go. Maybe they’ll help you too! 🔹 Code Runner Tool This is a super basic tool where you can write HTML, CSS, and JS and see the result right away. ✅ Good for testing quick ideas ✅ Works on mobile and desktop ✅ No login or signup — just start coding! 👉 Try Code Runner Tool 🔹 Code Editor Tool This tool looks and feels more like a real code editor. It shows line numbers and colors for your code, which helps keep things organized. ✅ Easy to read and use ✅ Beginner-friendly interfa...