Looking for more information on how to do PHP the right way? Check out PHP: The Right Way

Using Laravel Mix for Your WordPress Theme
May 12, 2017 @ 10:16:05

On the DotDev.co blog there's a recent tutorial posted from Eric Barnes showing you how to combine Laravel Mix and WordPress to make it easier to manage webpack dependencies.

Laravel Mix is a fluent wrapper around the webpack module bundler, and it provides common tools that help you compile CSS and JavaScript. It’s easy to work with, and although it comes baked into the Laravel framework, you can use it anywhere.

This site is using WordPress, and when I created the theme I used Mix to handle the asset compiling; it was simple to setup. Here is a quick overview of how I did it in four steps. Please note, you will need to have a recent version of Node and npm installed on your machine before continuing.

He then walks you through a four step process to set up the integration between the two:

  • Step 1. Create the package.json File
  • Step 2. Webpack Mix
  • Step 3. Create Your style.scss File
  • Step 4. Create an app.js

He ends the post with some helpful commands you can use while you're in the development process including compiling for both dev and production environments. More information about Mix can be found in the Laravel documentation.

tagged: laravel mix wordpress tutorial npm node css javascript install build

Link: https://dotdev.co/laravel-mix-wordpress/

Introducing Laravel Mix (new in Laravel 5.4)
Feb 09, 2017 @ 09:23:40

Matt Stauffer has posted the latest in his "What's new in Laravel 5.4' series with this new post covering Laravel Mix. Mix is a reworking of the Laravel Elixir package in previous framework releases but has changed a few things up in the process.

Laravel Mix. The same and yet entirely different from Laravel Elixir.

If you're not familiar with Laravel Elixir, it's a wrapper around Gulp that makes it really simple to handle common build steps—CSS pre-processing like Sass and Less, JavaScript processing like Browserify and Webpack, and more.

In Laravel 5.4, Elixir has been replaced by a new project called Mix. The tools have the same end goals, but go about it in very different ways.

He starts with a look at what's new about Mix and how it differs from previous version of Elixir. This includes changes in the structure of the configuration file, a different files/folders structure, helpers and quite a few other changes. Matt gets into detail on each item, providing code examples for the changes and a brief summary of how it's different for those that might have used Elixir before. Check out the full post for the full details.

tagged: laravel mix elixir css javascript compile helper v54 framework

Link: https://mattstauffer.co/blog/introducing-laravel-mix-new-in-laravel-5-4

Using Namespaces and Autoloading in WordPress Plugins, Part 2
Nov 03, 2016 @ 11:55:25

The TutsPlus.com site has continued their series looking at namespace-based autoloading in WordPress applications with part two. In this latest article they build on the simple plugin from part one and enhancing it with more functionality and autoloaded classes.

In the previous tutorial, we began talking about namespaces and autoloading with PHP in the context of WordPress development. And although we never actually introduced either of those two topics, we did define them and begin laying the foundation for how we'll introduce them in an upcoming tutorial.

Before we do that, though, there's some functionality that we need to complete to round out our plugin. The goal is to finish the plugin and its functionality so that we have a basic, object-oriented plugin that's documented and works well with one caveat; it doesn't use namespaces or autoloading.

This, in turn, will give us the chance to see what a plugin looks like before and after introducing these topics.

They start off with a quick review of the setup and previous development work done on the plugin making it easier to load in Javascript templates in a dynamic way. The plugin is then ready to start helping with the plugin use. They add in a basic CSS file to the site's "assets" folder and enqueue it. They start updating the plugin code, adding in an assets interface, a CSS loader and some styling for the box shown on the edit post interface.

tagged: namespace autoload wordpress plugin introduction part2 series autoload css loader

Link: https://code.tutsplus.com/tutorials/using-namespaces-and-autoloading-in-wordpress-plugins-part-2--cms-27203

Sound of Symfony Podcast:
Episode 11 - Looking forward to Symfony 4
Feb 04, 2016 @ 09:46:01

The Sound of Symfony podcast has come back and posted their latest episode with hosts Magnus Nordlander and Tobias Nyholm. In this latest episode (#11) they talk about Symfony 4 and look forward to some of the things they'd like to see in this future release.

Having recovered from SymfonyCon and had happy holidays, Sound of Symfony is back on the ether(net). This week we talk about what we'd like to see in upcoming versions of PHP and Symfony.

Other topics mentioned include:

  • Various Drupal initiatives
  • Sub-requests (a request to render just a partial page, not the whole thing through the HttpKernel)
  • Object-oriented CSS

You can listen to this latest episode either through the in-page audio player or by downloading the audio directly. If you enjoy the episode be sure to subscribe on iTunes to get the latest episodes as they're released.

tagged: soundofsymfony podcast ep11 symfony4 drupal subrequest, oop, css

Link: http://www.soundofsymfony.com/episode/episode-11/

SitePoint PHP Blog:
Transphporm – a Different Kind of Template Engine
Dec 17, 2015 @ 09:42:54

The SitePoint PHP blog has posted a tutorial on a "different kind of template engine" that makes use of selectors and placeholders to define templates and replace data: Transphporm. In this article they introduce you to the library and give some examples of it in action.

Many PHP template engines (Smarty, Blade, Twig…) are little more than abstracted PHP code, making it easier to write loops, if/then/else blocks, and display variables with less verbosity than vanilla PHP. These traditional template engines require the designer to have an understanding of special syntax. The template engine must also be in place and operational in order to parse data and thus completely render the final design. Nothing wrong with this.

Transphporm follows a different approach that is generally known as “template animation”. What this means is that the web designer creates the entire HTML/CSS/JS page including placeholder content such as “Lorem Ipsum”, then the template engine comes along and replaces parts of the DOM with new data before the final render.

The benefit of this kind of templating is that the designer or one creating the templates doesn't need to know anything about the templating software or a special syntax. Transphporm uses CSS-style selectors to define the replacement location and the data that should fill that spot. They give an example of a simple HTML page with plenty of markup defining the locations of the placeholders. They then show how to define a "tss" configuration, listing out all of the selectors and the content to push in as a replacement. They also talk a bit about DOM concerns, what happens if the template changes and the selector is no longer valid and how to help this with partials. Finally they look at some of the more advanced features like using arrays, working with attributes and conditional changes (among others).

tagged: transphporm template language css selector tutorial

Link: http://www.sitepoint.com/transphporm-a-different-kind-of-template-engine/

SitePoint PHP Blog:
Automatic Asset Optimization with Munee
Oct 12, 2015 @ 10:26:42

The SitePoint PHP blog has posted a tutorial showing you how to optimize how your application works with assets with Munee.

Munee is a n asset management tool which can compile LESS, SCSS, or CoffeeScript, manipulate images, minify CSS and JS, and cache assets on the server and client on the fly. It works with PHP 5.3 and newer versions.

In this tutorial, we will learn how Munee makes it easy to include assets in templates, how to install it, how it works and how to use it. Munee is another way to avoid NodeJS in asset management of PHP apps.

He starts the article with a few reasons why you'd want to use Munee to manage your application's assets including automatic minification and both server and client side cache handling. He covers a bit about how it works and what it does to cache assets via simple HTTP headers. He then gets into the actual installation of the tool, the code needed to run it in your system (a one-line call) and how to have the server rewrite all the requests back to the waiting PHP file. He shows how to compile different asset types including SCSS, LESS and CoffeScript files as well as minifying Javascript and CSS. Munee also includes an on-the-fly image resize handler that will also cache the results. Finally he talks about how you can use it to combine assets and briefly about the API the library provides for some other functionality.

tagged: asset optimization munee tutorial css javascript less scss coffeescript cache

Link: http://www.sitepoint.com/automatic-asset-optimization-with-munee/

Three Devs & A Maybe Podcast:
The First All-Episode Quiz
Aug 14, 2014 @ 09:17:35

On the latest episode of the Three Devs & A Maybe podcast Michael Budd, Fraser Hart, Lewis Cains and Edd Mann have their first quiz show (Episode #38).

This week we start our chat off with the myth of just simply 'reskinning' a website, along with the dreaded !important in CSS. Following this, as we love quizzes so much, we decided to dedicate a full show to one. In this weeks quiz we touch upon many areas of PHP, JavaScript, CSS and random computer/programming history. We also now have t-shirts on sale, available via the first link in the show-notes (why don't you treat yourself).

Topics discussed in this episode include AngularJS fundamentals, speed in software development and avoiding burnout. You can listen to this latest episode either through the in-page player or by downloading the mp3 directly. If you enjoy the show also consider subscribing to their feed.

tagged: threedevsandamaybe podcast ep38 quiz episode reskin css history

Link: http://threedevsandamaybe.com/posts/the-first-all-episode-quiz/

SitePoint PHP Blog:
How to Create a Laravel CSS-Minify Command
Jun 11, 2014 @ 14:58:31

The SitePoint PHP blog has a new post today from Tounes Rafie showing you how, in a Laravel framework based application, to create a minify command with the framework's "artisan" command.

In this article you’ll learn how to use Laravel’s Artisan command line tool, and how to create a customized command. Note that you need to be familiar with the Laravel framework to get the most of this article. In this tutorial we’re going to build a command to minify our css assets.

He starts with a (very) brief look at what Laravel commands are and the options this articular one will include. Next up is the code you'll need to create the command, making use of Laravel's integration of the Symfony Console component. He shows how to register the command with the rest of the application and how to work with the options/arguments for the input. From there he shows how to run the command and how to make some other improvements including colorized output and more information on execution.

tagged: css minify command laravel artisan framework tutorial

Link: http://www.sitepoint.com/create-laravel-css-minify-command

SitePoint PHP Blog:
Getting Started with Assetic
Apr 14, 2014 @ 10:37:00

The SitePoint PHP blog has a new post from Lukas White today looking at the Assetic asset management library and how you can get started using it in your application.

There was a time when asset management meant little more than inserting a <link> tag or two and a couple of <script> tags into your HTML. Nowadays, though, that approach just won’t cut it. There’s performance, for one thing. [...] Also, as client-side applications have become more and more sophisticated, managing dependencies amongst scripts and libraries has become increasingly complex. Furthermore, technologies such as Less, Compass and Coffeescript require assets to be compiled, adding yet another step to the process of managing assets. In this article I’m going to look at a PHP package called Assetic which helps manage, compile and optimize assets such as scripts, stylesheets and images.

He briefly discusses asset management first, just to get everyone on the same page as far as what "assets" are and some considerations about their use. Next is an introduction to the Assetic library itself and the install/usage of a simple "AssetCollection" object. He also shows how to add assets to the object and how to configure compression and generation of the files (like with LESS). He also shows how to use the AssetManager and FilterManager object types along with the AssetFactory handler. Finally, he talks about some of the sample output and caching the tool can do with file-based cache handling.

tagged: assetic introduction asset tutorial javascript css less compress

Link: http://www.sitepoint.com/getting-started-assetic

Using Composer to Install JavaScript, CSS & Images Under the Web Document Directory
Jan 07, 2014 @ 12:36:07

On the PHPClasses.org site today there's a new post showing how to install more than just PHP packages with Composer including things like Javascript, CSS and image files.

By default Composer installs all package files under the vendor directory. If you want to install asset files in the Web document root directory, you need to resort to another solution. This Asset Manager package is a plugin that extends Composer to install any package files outside the vendor directory. Additionally, it can also read the user names and passwords from a configuration file, so you do not have to enter them every time Composer retrieves packages from repositories that may require authentication, like PHP Classes and JS Classes.

Using an asset manager plugin for Composer, he shows how to include an "extra" section into your "composer.json" for the other files. There's also an example of how to implement a custom installation action that, in this case, was used to implement the "extras" functionality. The post finishes up with a look at handling authentication in the Composer requests, using the same tool to parse a "config" section with Basic HTTP authentication information.

tagged: composer package install javascript css image assets http authentication

Link: http://www.phpclasses.org/blog/package/8429/post/1-Using-Composer-to-Install-JavaScript-CSS-and-Images-Under-the-Web-Document-Directory.html