I wasn't quite sure where to post this, but this place seemed appropriate. I've noticed during the time I've been doing web development that I waste more time configuring and setting up my environment, than actually making an application itself. I've tried using lots of tools such as grunt to automise tasks but I still end up wasting way too much time.

Example: I had to write a simple web-app today with some basic bootstrap styling to make it look presentable to customers, so I decided to use SailsJS since I read lots about how the development process is incredibly fast. This is when I spent more than an hour just copying and pasting assets (mostly front-end) from bower, npm and various other places, just to get it working. Where as in all of the tutorials they simply press a magic button and everything works perfectly instantly.

My question is this, how do I speed up my development, and not have to worry about wasting time installing external libraries via bower, npm?

  • Are you able to leave comments on those tutorials asking how they did it? – JeffO Apr 4 '16 at 20:19
  • @JeffO depends on where I'm reading/watching the tutorial, on some websites they allow it but I haven't ever received much help via comments in the past – Paradoxis Apr 4 '16 at 20:20
  • 1
    Unfortunately this is way too broad for a Q&A site like this. The solution (if it's even solveable) is likely to be completely different for each project and may be anywhere from use different libraries to get better at configuring stuff to picking a framework that does it all for you. Incidentally, I have exactly the same problem with C++ rich clients or backend services, so I don't think this is in any way unique to web frontends. – Ixrec Apr 4 '16 at 20:26
  • This is what things like docker are for. Just pull in the docker image for your dependencies and everything works out of the box. Not sure about node, but maven in java and gemfiles in ruby accomplish a similar thing, just specify dependencies and env is ready. – Click Upvote Apr 4 '16 at 21:58
  • 1
    You mentioned spending an hour to get it working. Cool. May be you should watch how movies get produced. Many takes and eventually few that look good get into your picture. Spend some time and learn with patience. There is no magic. It exists only in movies and fairy tales. – randominstanceOfLivingThing Apr 5 '16 at 3:41

I would say there is always a certain amount of set-ups required to get a project going and I know this can get sometimes annoying. However, if the system turns into a large scale system, this time is well spent and will save you later headaches.

To cut down the time ensure to pick a framework that is appropriate for your needs - a lightweight library will get you up and running faster than a full featured framework with all bells and whistles. But the latter might be more appropriate for a larger scale project. Then once you picked the framework, make sure you actually read the documentation and understand the framework.

In alignment with that, you say you started using SailsJS for something that was time critical. In my experience, when you need speed stick with the technology you already know - familiarity almost always offsets the "magic" of the latest frameworks when you have never used them. Explore new frameworks on sideline projects that are not mission critical until you are ready to use them for real production - that way they will actually speed you up.

Another thing: make sure you have the correct tooling in place. You say you spent an hour copying assets from NPM etc. The whole point of these tools is that you don't copy things around. You just run npm install cool-library and it installs the cool-library and all dependencies. So if you haven't done that, you should really read up on NPM and get yourself set-up correctly.

  • "Then once you picked the framework, make sure you actually read the documentation and understand the framework." Yes, but do this before using it on the project; study the framework, and if it's appropriate, try it out. Picking an inappropriate framework early in the project will cause more headaches than just starting from scratch (or with a small library as you suggested), especially when it comes to Javascript. – Jeffrey Sweeney Apr 7 '16 at 20:14

Start small.

For any project, ask yourself what you need to have done, bare minimum. Don't worry about what jQuery plugins are available or what version control software to use or what preprocessers you should code for or anything too technical. Start with two files: index.html and script.js. Maybe a few small libs for POC work.

A little further down the road, set up a git repo or something. It doesn't have to be remote, or hosted on a server somewhere. Just make a local repository. Or don't. It's up to you.

As you progress, identify pain points, and start creating new files to isolate these issues. Keep everything organized (yes, you can organize code without an overarching framework). Make it so, down the road, you could replace isolated pieces of your code. Consider adding more libraries that target specific needs.

And speaking of, before even worrying about a package.json file (or a gulp/grunt/webpack equivalent), try out libraries by just downloading their source code (excluding it from your main project of course). If you decide to keep it, create a build script, and add this library as a dependency.

The bottom line is that you don't need bootstraps or build scripts or massive frameworks to start working on something. If these tools prove themselves to be helpful for what YOU are working on, then you can incorporate them.

Not the answer you're looking for? Browse other questions tagged or ask your own question.