DEV Community

Sumit Wadhwa
Sumit Wadhwa

Posted on

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

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?

Thanks.

Top comments (3)

Collapse
 
ben profile image
Ben Halpern

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.

Collapse
 
ope profile image
Ope Adeyomoye

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:

Collapse
 
swadhwa16 profile image
Sumit Wadhwa

recently I've stumbled upon one such category by Alan Storm: Modern Javascript for PHP Developers