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?
6
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.
1
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.