Skip to content

Q: How to set up a Front End Environment in a PHP project?

chandlerbing016 profile image Sumit Wadhwa github logo ・1 min read

So I've just started digging into Codeigniter (a lightweight PHP framework) and wish to set up a complete front end development environment with, as it has nothing like this out of the box. A little light weighted replica of one Laravel employs, if you may.

In the process, I've stumbled upon different terminologies such as JS Task Runner, CSS Preprocessor, CSS Framework, Bower, and webpack, etc.

My question is: What would be the best way to get to know more about them and most importantly, piece them together to make it work?


twitter logo DISCUSS (3)
markdown guide

Depending on your needs, it's still perfectly reasonable to write plain old Vanilla JavaScript and include it in the page using a <script> tag. You can eventually replace it with some of these powerful but complicated tools as long as your original code isn't pure spaghetti.


If you're already pretty comfortable with JavaScript then one way to get comfortable with front-end development environments is to learn from templates.

If, for example, you decide to go with one of the JavaScript frameworks that are popularly used to create Single Page Applications(SPA), you're likely to find some sort of "starter pack" for that framework. And it'll usually include CSS pre-processors, JavaScript bundlers, and, importantly, good documentation on how they're pieced together.

Once you're comfortable with the front-end setup in your favorite JavaScript framework, it becomes clearer how to combine it with your PHP project to fit what you want.

(I usually just drop my package.json in the same directory my composer.json resides, npm install and continue the setup adventure :) )

Here are sample "starter packs" for a couple JavaScript frameworks:

Classic DEV Post from Aug 6 '19

What to put in your portfolio as a beginner web dev

Sumit Wadhwa profile image
Web Developer