Below you will find pages that utilize the taxonomy term “Tutorials”
An Adobe Experience Manager (AEM) “Blank Slate” basic starter site example to demonstrate creating basic pages, templates and their components. This site uses static templates and covers a couple of key AEM concepts including the Proxy Component Pattern. This tutorial was created using AEM version 6.4
In part 2 of the series, we’re adding the site content to a
search.json file when the Hugo static site is built and importing it into a MongoDB collection. Then in the Node.js Koa app, we create an API endpoint that returns search results from the collection in MongoDB.
This project demonstrates how to create a development environment utilizing a Docker stack of Nginx to serve the static website, Nodejs for the api applications, MongoDB for the api data and Traefik for reverse proxy. This stack is suitable for deployment to staging and production environments.
Designs typically require more than the out of the box demos provide, which is understandable. The slick carousel demos will get you most of the way there and provide examples for various settings. This post is an example of how to dynamically update the slick
slidesToShow value as the viewport is resized, demo.
While converting my WordPress content into markdown files for Hugo, I wanted to keep my permalinks exactly the same. For my existing content that spans more than a single page, I created a way to do this without server rewrite rules or Hugo aliases that use
meta refresh which is sub-optimal for SEO performance.
Follow these instructions for PHP provided with Mac OS X to
phpize Xdebug source, configure, build and install the PHP Xdebug extension.
I always thought it was odd to use the
webpack-dev-server instead of
webpack in my npm script for development. Lo and behold, last month,
webpack-plugin-serve was released, a new webpack plugin to use instead of the quirky webpack-dev-server.
How to create a WordPress custom shortcode to display photos from flickr. This post documents using the Slick Lazy Load Photo Grid along with the flickr API to render photo albums in Wordpress Posts wherever the shortcode is entered. Webpack 4, autoprefixer, and babel are included for building the JS and CSS.
This post documents how to create a fully responsive flexbox content layout that contains a pure CSS open/close toggle for the left and right sidebars. The CSS is built from Sass using Webpack with Autoprefixer. For development, a Webpack Dev Server is included.
This post continues where part one left off. Topics include mysql data migration, staging and production docker configurations with optional https.
This post will cover how to use Docker for a local WordPress development environment and how to deploy it to an Ubuntu Linux server running docker.
This post documents how to get https working on your local Docker development environment using Traefik as a reverse proxy for multiple services.
For those ready to move beyond a simple “Hello World” module, this post documents building a Drupal 8 module with a Giphy search form in a custom block. The form uses jQuery to request data from the Giphy API and display the results.
This post is a simple proof of concept for using the new WordPress REST API to submit a new post draft from the front end. The form and user inputs are built using the Vue.js framework and vue-cli to create a simple Webpack build configuration. Demo on YouTube
This post documents how to add an e-mail confirmation to the Laravel User registration that is generated by the Artisan console. In this example, the registered user will not be able to login until the activation link that is sent to the users registered e-mail account has been loaded into the browser.
After discovering how nice the vscode-php-debug extension works in Visual Studio Code on my Windows 10 laptop, I wanted this same setup for a PHP project on my work Mac Book Pro running OS X Yosemite (10.10). The version of XAMPP I currently have installed on the Mac is 5.6.11-0 and for this tutorial, there are a few requirements to consider…
Documenting my XAMPP for Windows setup for myself and anyone else who finds it useful. For those of you that do not know, XAMPP is a completely free, easy to install Apache distribution containing MySQL, PHP, and Perl. I still have my Virtual Machine for LAMP Development which I will use for test deployments of my localhost LAMP development prior to production deployment. This local XAMPP setup will be better for debugging, working with node modules and grunt tasks for preparing the deployment build.
As a follow up to jQuery Mobile Cascaded Selects using MVC4 and KnockoutJs, I have created this AngularJS Cascaded Selects tutorial that gets it’s data from the Chinook Web API Project. The application uses angular data-binding and the ngOptions attribute to dynamically generate a list of option elements for each of the three HTML select elements.
This tutorial will walk you through the creation of a basic Windows Forms application to test remote authentication and authorization when communicating with a DNN CMS web portal using its web services framework / Web API. This is for development and educational purposes only running locally. You will at least want to make sure that you have SSL enabled for your DNN Web Services in a real world scenario.
This tutorial will guide you through the steps necessary to add a session timeout timer and alert dialog within a DotNetNuke (DNN) Module using AngularJS. Key concepts:
When building the DotNetNuke Web Services API controllers, I want to use this REST convention for the endpoints to access a resource such as the Chinook database. Note: My DotNetNuke website is running under IIS 7.5 with “dnn7” as the host name binding. Only the request method, url, protocol, content-type and content-body are included in request examples below.
I needed to setup a localhost Drupal development environment to upgrade a Drupal 6 theme and do some testing prior to upgrading a live site to Drupal 7. I decided to give the Microsoft Web Platform Installer a try on my Windows 8 computer.