Web Development Tools

Okay, so my first question is, what are the most essential web development tools, like anything from boostrap to jquery?

But I also wanted to ask you guys, what's the best sass compiler for windows, I've tried messing around with one or two, but they tend to be pretty buggy and unreliable, can anyone suggest something more stable?

Finally, can you mention tools that are great, and cost isn't always an issue, of course I'm not talking about serious investment, like buying PHP Storm or something, but just something that tends to be a step up from all the freebies. For my code/text editing sofwtare, I am currently using both Atom and Brackets, I find that I prefer one over the other for different reasons, if that makes sense? - I mean there are some features I prefer of Atom and some features I prefer of Brackets.

But I do want to step up from being classed as a junior web developer, I want to take my work that extra step further, and I would like all the essential/available tools that could help me get there!

I also want to SERIOUSLY improve my design skills, can anyone suggest how I'd go about improving my design skills, cause so far, my projects have been a sorta hit and miss kinda thing. One day I can produce a piece of work and think to myself, yeah, this is really nice, it works so well, other days I can make something and half way through, I'll just say NO! This is awful, it must be deleted, it looks like the work of Satan.

I don't plan on being a professional designer, I feel that I'm not artistic enough to become a professional designer, when I compare my best work with the top dogs. Of course I know my work wouldn't be anywhere near as good, but you get what I mean, I feel a tonne of envy for some excellent designers. I really want to improve, I don't mind how long, or expensive it may be, whether it be financially or time consuming, you get the picture, I'm dedicated to what I do.

Final note: What OS should I focus on, or does that not really matter with web development/design? - I hear a lot of people claim that apple is the holy land for any web work, but I wanted to ask you guys! Sorry if I've repeated myself once or twice, I'm rushing this post, and I'm very tired, I'd appreciate any form of help or advice! :)

I think it depends on your situation.

I like using the JetBrains products. I got Idea ultimate through work and it's wonderful.

Obviously it depends heavily on your work style and what sort of environment you enjoy using.

It's hard to improve design skills by setting out to improve them. (imho) The way I do it, is I keep working. I aim to do at least one frontend a month and after a few years, I've improved a bit about building things that look as good as they function.

Doesn't matter. Some people say you need "this platform" to work best, but honestly, it's up to you. I prefer to work in Linux because it's what I know and love. I also find I'm more productive when I don't have access to all the games I have on my Windows partition. So, in short, either choose what you know or do some expiramentation to find out what you like best. They all work, and IDE's are starting to be built for all 3 major platforms.


You can't learn everything on codepen because some things are automated. Go there and learn how to do it. Then worry about what kind of OS you want. The best OS is the one you like best. You can also try different code editor features, just go to preferences.

I'm no professional, but I also use Brackets and Atom, so those are probably both good tools. Brackets' live preview feature is totally amazing for CSS work.

It seems this may be of interest to you if you do CSS/HTML work with Brackets:

It supposedly enables live preview for SASS within brackets. I haven't tried it but it looks promising.

As far as OS, I use Linux just because that's what the web servers use, and because I like it better. Like you're noticing with SASS, a lot of the tools are not the most windows-friendly things in the world. With Linux, I can install Apache on the same machine I do development on. It's also much easier to do custom scripted tools, and do things like using Git to manage changes to a project. All of that CAN be done on Windows, but I've always found it to be a major pain in the rear.

1 Like

I know exactly what you mean there, windows does have bonuses, but I feel that for web dev, I may convert to linux, I've used linux a lot before now. Used to use Ubuntu as my main OS. But I changed back to windows for gaming, and yeah, I noticed that simple tools like SASS compilers, they work fine in linux, no problem at all, but windows.... sigh.... Windows....

The tools depend on languages that you actually use. And if you do not intend to be a web designer, then why the hell would you want to learn about how to be one?

So, what languages do you intend to use?

One of my favorite things in Linux is that GNOME's Nautilus (and most other file managers) has an "Open this folder in terminal" button. I can just go to the directory where all my crap is, and cilck that however many times. Then I've got Git, I've got SASS, I've got a Python prompt, whatever I need is just there. Like magic.

1 Like

Well naturally I suck at Web design, I just want to find ways how to improve my design skills. I just want to learn or study other how other people do their designs, what makes them really sad out, what makes them look all professional and pretty, etc.

I plan on using various languages, I plan to try and use obviously the necessary one's, PHP, HTML, CSS, MySQL, etc. But I'm unsure about what else I'll be using, I know in my third year of uni, I'll be using C# for Web, we'll also be using a lot of AJAX.

I'm not sure if it would be necessary to learn anything else?

When I say I suck at web design, I'm just awful at it... I don't plan on making stuff that looks out of this world or anything special, just something that's nice to actually look at.

Not sure about everyone else but I've just been using Visual Studio Code after trying Sublime, Brackets and Atom. Although I run linux so my options are going to be different than someone on Windows. I like VS Code because it makes Git easy and I like the layout. Atom is very similar, mostly because I think VS Code was forked from Atom.

As for the other tools, I really don't know. I'm curious to see what everyone else uses. I recently started using Angular and Sails where I now have my own boilerplate I can work from. I'm sticking to standard CSS and HTML for now, but I may move to SASS in a later project.

1 Like

I say to stick to the basics. Work on making things easy to access, easy to read, load quickly.
Stick to basic typography, make your page responsive, use semantic markup.

That's about it, perfect that and you're good. You'll find out that as you practice and read things you'll just become better.

1 Like

I have to say, I didn't realise that VS have been working on this, it has been a while since I've looked at anything they're working on, but hell, I'll try out VS Code, it does look a lot like Atom.

I hear that simplicity is the best, but that's my problem, I always over complicate things, and I think that I've managed to get the whole responsive thing pretty much spot on, I do need to work on it a little bit. But it really doesn't take me long to make a web page responsive, I do need to include more responsive features on my own website though in all honesty, at the moment to responsive components are very basic. But I guess it shouldn't be too hard to try and sort that out.

One final question, does anyone bother worrying about JS being turned off anymore? - I'm only asking purely because I'd like to include a lot of JS features, but I just can't imagine a lot of people having JS turned off, of course there's some people out there, but not a great deal, or so I would've thought?

Your page should be able to function without javascript. That is, you should be able to view the page, read the article, click some links etc. It doesn't have to work perfectly without it, just still be accessible. Include as many JS as you want, just make sure you don't overuse $(document).ready().

You actually shouldn't use $(document).ready() at all. If ou put you script right above the closing </body> tag, then it is automatically executed right after DOM has been created. And without all the waste.


So, what you actually are looking at is PHP development stack and, to be more precise - the associated tooling.

The most important would be either VirtualBox or Docker. Unless you are using FreeBSD, in which case all you need is to learn about jails. These tools would let you separate your development environment from your own operating system.

For DB management you should use MySQL Workbench.

And then there is PHP. Well ... you will need to learn how to use Composer for managing the projects dependencies. PHPUnit for unit testing. If, what you write, is opensource, you will also benefit from https://travis-ci.org/ and https://scrutinizer-ci.com/. For debugging there is Xdebug and phpdbg.

Oh and you will have learn how to use git.

That should cover the basics.

1 Like

sometimes it's necessary. Assuming you put in content before the dom has finished loading. On that note, you would use async defer.

What do you mean by it?

It depends, on the application. Sometimes you want to avoid a flash of unstyled content, and sometimes you need a script to execute before the body has fully loaded.

You obviously did not understand, what I wrote. With the method, that I described, there is no "flash of unstyled content".

I'm talking about situations where content is pulled to the page. (via json or something similar.)

That point aside, you are correct.