Blog

The first thing you need to do is go to the gist file install-files. Once you get there you will click on the Raw.

Then you will copy the url at the top

Open a terminal and enter the following “curl” + the url + | bash

 It will cause all of the files to be downloaded.  Next you need to setup the shell to work you will need to type:

source .bash_profile

First we need to make sure that you do not have any other web server running. Open a terminal and type

valet-list

If you had running programs you will need to

type valet-destroy

Next type

valet-install

You can now fix yourself a drink and kick back, as it is going to take a while.

If all worked correctly, you will have a webpage open with the following:

Now we need to edit ~/bin/wp-create and put your information in it.

• HOME will be your home directory, i.e. dgs, danny, etc
• dbuser and dbpass are both root
• dbprefix is what you want it to be, I recommend your initials with an underscore
• admin_user will be anything other than admin, I use dgs
• admin password is just what you think it is
• admin_email is your email address

There is also a wp-drop, but you don’t have to make any modifications to use it. It will delete a wordpress site.

Now for the fun part, want a plan html of php site? create a new directory is Sites, and you are done.

Want that site to have an ssl certificate, type within that directory valet secure sitename.

I decided to automate the install of Laravel Valet and check and make sure that programs are not running that would prevent it from running. For example it will check for other running web server software such as XAMP, MAMP, Local by Flywheel, and Desktop Server and warn the user so they can remove it. It is an opinionated install so fee free to change it.

NOTE:   You will want to have backed up both the database and WordPress files before you run this software. I am not responsible for any lost data.

I have included a script valet-list, to use to first check and see if any web server software is running.  If it is, run valet-destroy.  If valet-destroy comes up clean, you can run valet-install.  Please note it just lists if non-valet web server is running, it does not remove all of the software.

You will need to create a bin directory off of you home directory, add the files, and set the permission

cut, paste into terminal, and run

https://gist.github.com/dannygsmith/a7b5044c272755d121b63021e83429e4

You will now want to copy the code from these gists place it in the corresponding files by using the text editor of your choice.

valet-list

https://gist.github.com/dannygsmith/ca96e5face7cd1f02ce62aad490cfe2d

valet-destroy

https://gist.github.com/dannygsmith/5b74ba708d7bf8621c1cb6b959ece99f

valet-install

Note: You may be asked to enter your password twice…
https://gist.github.com/dannygsmith/ccaa9712cb5bdc73e43276a63643366b

With the help of https://knowthecode.io/labs/lets-build-non-wordpress-sandbox I am going to help you setup a sandbox for all of your non WordPress php projects. Why may I ask to I need this? Have you ever struggled with debugging and wished there was a better way? There is and I am going to show you a way.

The first step will be to install composer to your system. I assume you already have git installed, if not you can skip this step and download the file later rather than use git. First we need composer. We will need to run this from the command line:

Get Composer

You will now have a composer.phar file located in the current directory. I typically rename it to composer and on linux/mac systems change the permissions for the user to execute. I then move it to my local bin directory that is in my path.

Make executable

Now we are ready to install Whoops Kint and Composer for our sandbox.

Install sandbox

If you don’t have git, just download the file from https://github.com/KnowTheCode/Non-WordPress-Sandbox

I am going to show you the big gun first, but we need to edit demo.php first to have the following content:

Setup whoops

Let me give you a hint, this code is going to fail badly. But we want it to so we can see what happens.

Run whoops

Ok lets comment out the error and look at kint. Have you ever wondered what was in the php superglobal $_SERVER? Well this is your lucky day.

Setup kint

Run kint

I hope I have whetted your appetite for learning more about Whoops and Kint. There is a free training class at https://knowthecode.io/labs/lets-build-non-wordpress-sandbox It is about 40 minutes of video and it explains it much better than I did.

You may say, what are these tools for, and why do I want them.  Have you ever had someone want to change the color of a website, and you have to do at best a search and replace to find all of the occurrences.  What if css had variables and you could set one for the main color?  Well css does not but Sass/Scss does.  What we want is an automation script that passes the files to the compiler and converts the variable on the fly for us.  While we are at it, lets check for errors and concatenate the css files as well as the javascript files and compress them.  Sounds to good to be true, right?  Well the devil is in the details, and it can be hard to setup, hence the need for this tutorial.

To install the development environment on macOS I use Homebrew and NPM.
Installing Homebrew is effortless, open Terminal and enter :

Installing Homebrew Copy

$ /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

Note: Homebrew will download and install Command Line Tools for Xcode 8.0 as part of the installation process.
Next run:

Setup Homebrew Copy

brew doctor
brew update

Now we can download Node/npm:

Install node Copy

brew install node  

If you don’t already have git, you will want to install it as well:

Install git Copy

brew install git  

We will now create the directory for our website, the basics have been done.

Create directories Copy

mkdir ~/Sites/my-sandbox
   cd ~/Sites/my-sandbox

We will now download the framework that I have forked from https://knowthecode.io which has great training classes by the way. To do this we will clone the source into our newly created folder:

Install UpGulp Copy

git clone https://github.com/riskiii/UpGulp.git . 

The next step is important, it will create all of the magic for you:

Install npm libraries Copy

npm install 

It is time to get a coke, coffee or your favorite drink, as this may take some time. It is downloading a lot of files.

The only file you will need to change is

Edit config file Copy

config/gulp/config.js

You will want to edit this block of text:

Edit block of text Copy

   var moduleSettings = {
      package: 'campfirepixels',
      domain:  'campfirepixels.dev',
      // If this is for a theme, set to `true`; else, set to `false`.
      isTheme: true,
      i18n:    {
         textdomain:       'campfirepixels',
         languageFilename: 'campfirepixels.pot',
         bugReport:        'https://cfp.dannygsmith.me',
         lastTranslator:   'Danny G Smith <dgs@campfirepixels.com>',
         team:             'Danny G Smith <hello@campfirepixels.com>'
      }
   };

Replace my website and name with your own, and we will be ready for the next phase.

Now let me explain the conventions that I have setup. All scss files will go into

scss files location Copy

/assets/scss/some-directory

How you set that up is up to you. The assets directory is all you should change until you get comfortable with gulp, and that may take a while. I would start out creating the following directors, just as an example.