Setting up WordPress environment on vagrant

Standard

It has been a while away from WordPress development.

First, my previous works normally have used other backend frameworks or languages. Second, my role of front-end development has been always for big products. I haven’t worked from scratch last 2 years. Now my current job will end soon – it was a very great environment to work there- and WordPress seems to have a rising curve again.

I wasn’t really trying to recover my memory on WordPress. There were no work or developer friends who mention how WordPress workflow has been changed. Furthermore, many of developers developing WordPress using old passion way to develop. I didn’t want to mess up my user library on my Mac – I have a horrible experience while I tried to learn Ruby on Rails. I am also not a big fan of MAMP either along with PHP admin stuff.

The thing is, even though everybody hates PHP, it will survive for a quite long time. You cannot really be out of scope in this industry. Perhaps PHP is not so great for enterprise or government campaign but PHP has absolutely great CMS frameworks. WordPress is top of them, I reckon.

I still hesitated to set-up WordPress development environment. The main reason is due to my laziness, but what sort of developer would love repetitive and patient (&tedious) works? I haven’t written plain CSS since I started using SCSS and Compas. Even I haven’t write plain javascript and HTML on one single file since I have used task runner. Yeah. Task runners and processing compilers ruined me. I cannot write long and tedious codes. I will hurt my eyes to read them. Yeah..I am not that hard working type or patient. I am not a superman-developer either. I am just an average level front-end developer, and I have worked fine for projects. (Cheers to Australian IT economic woohoo!)

Good thing is, there are tons of lovely developers in the world who share their intelligence and leave their codes open on GitHub. And I highly benefit from those. hehe. I googled some open stacks for WordPress and found two containers for WordPress. http://vccw.cc/ and https://box.scotch.io/

First I tried https://box.scotch.io along with https://github.com/flurinduerst/WPDistillery

It was not WORKING. When I installed the scotch box first, it successfully loaded up index.php. It seems like developing pure PHP or Laravel project looks fine. But I want my FREAKING WORDPRESS happen on this container and the connection has failed.

This is what the initial page looks like when you load up scotch box.

68747470733a2f2f73636f7463682e696f2f77702d636f6e74656e742f75706c6f6164732f323031352f31312f53637265656e2d53686f742d323031352d31312d30332d61742d312e33312e35322d504d2e706e67

and once you rolled up wp distillery, it just fucked up everything. I thought I did something wrong in the vagrant box bash. I tried to successfully install WordPress in the scotch box by command line what WP distillery says but no. It didn’t happen.

So I move back to vccw. When I firstly loaded the vagrant up, it took ages. Once you’ve set-up everything, it looks alright. All pre-setup just beautifully showed up without any hassle.

The image below is from a vccw review blog (Japanese http://tonari-it.com/vccw/). My environment looks same.

060-vccw-dev

Alright. Let’s install some base WordPress theme boilerplate. I need gulp, foundation6, bower, and so on. I am so excited to use these foundation theme structures

 

Oh..wait. What is the version of NPM?

Screen Shot 2016-08-26 at 1.48.05 PM

..Are you fxxxing kidding me? The node is now v5 out..and this still uses v.10.36..?

No fucking way to use this box. I gotta find another way to work on WordPress. Since the Scotch box is fully for LAMP stack..there must be a way to install WordPress in the VM box. AND I FOUND THIS BLOG. THIS IS WHY I LOVE INTERNET!!! SHARE AND LOVE!

Scotch Box

Following the instruction on the blog post, it was very simple Tick-and-go.

http://jonathanbossenger.com/setting-up-a-local-development-environment-with-scotch-box/

I downloaded WordPress zip file(v4.6) and paste into the public folder.

Screen Shot 2016-08-26 at 1.56.10 PM.png

Heck ya! It is working! 🙂 Scotch box was much faster than VCCW when booting up and now also I can install WordPress too! Awesome! Now I guess it is development time.

Also look at the node and npm version. Perfect!

Screen Shot 2016-08-26 at 2.24.13 PM.png

I will review the new theme development base themes in next post.

If you want to upgrade php5 to php7, please go to this page https://github.com/scotch-io/scotch-box

These are the base theme that I am going to review next time.

https://github.com/olefredrik/foundationpress/ http://jointswp.com/docs/gulp/ http://underscores.me/

and thanks for the inspiration
http://watch-learn.com/

Reference site while I tried to develop WordPress again.

How to Build a WordPress Theme Part 1 – Theme Files