Migrating a Wordpress Powered Site to GatsbyJS
January 11th, 2018
We walk through our experiences migrating a fairly large WordPress-hosted application to an entirely different model with statically built code via GatsbyJS + ReactJS
We walk through our experiences migrating a fairly large WordPress-hosted application to an entirely different model with statically built code via GatsbyJS + ReactJS
Recently, I had the need to share an svg chart between a javascript (React) app, an android app, and an iOS app. One option would be to write code in all three application to generate the chart, but a better option is to push the generation of the…
Use redux-saga and redux-saga test plan to simplify your Redux-based React application with shiny new JS Generators.
An all-encompassing overview of why CSS in JS exists, what problems it attempts to solve, real-world usage of various solutions, and finally some drawbacks of CSS in JS.
GraphQL in Spring Boot (Take Two)
Angular, React, or Vue JS: Which one is for me?
Gatsby is an incredible static site generator that renders to static HTML from React content. In this tutorial, well build a sample blog powered by Gatsby
Learn the basic components of an Amazon Alexa skill, starting with the vocal interface design and progressing through the software development life cycle.
Spending time and effort to design and build user-friendly APIs is no longer a “nice to have”. APIs should be embraced as a product in their own right.
Get up and going with the simple, centralized state management lib called Vuex.
In Part III of the series we explore how to tackle variable-length arrays, even if those arrays appear in nested objects within a components state.
In this post we explain how to use lodash to access nested object properties on a components state object so they can be bound to JSX form elements.
Part I of a series on two-way data binding in ReactJS. Describes how to take advantage of JSX dynamic attributes to implement rudimentary data binding.
Pre-compiling your Angular code can significantly reduce bundle size and improve performance. In this article we will review an example app to see it in action.
EDIT: Headless Chrome is shipping in Chrome 59 so the need to use the full Canary path will eventually go away. You can check your Chrome version in the menu under Help > About Google Chrome. This walkthrough shows you how to get headless Chrome up…
Cordova and React Native are JavaScript based frameworks for building cross-platform mobile apps. They differ greatly in their approach, with Cordova being embedded web view centric, and React Native being native centric. React Native is just one of…
Add the Universal Windows Platform to your existing React Native app, using a Windows 10 VM in VirtualBox, and the React Native Windows plugin
Start developing Universal Windows apps with React Native, using a Windows 10 VM in VirtualBox, with the React Native Windows plugin
Synchronizing Rest Service Schemas
Describes how to take advantage of Webpack hot module replacement (HMR) in an Angular 2 app, with Redux.
Exploring the differences between the Express.js and Hapi.js Node frameworks, considering strengths and weaknesses of each.
Adding Logging and Swagger to a Hapi Node Server
Intro to creating a node server using Hapi instead of express. We will then look at validation use the Joi library.
VueJS is a hot contender with ReactJS, but includes most of that stuff you loved about Angular and less of the stuff you didnt.
Describes a technique for using the Canvas API in an Angular2 Component.
Strategies, tips, and gotchas for migrating a cross-platform mobile app from Cordova to React Native
Exploring Cordova/PhoneGap, React Native, and NativeScript for hybrid/cross platform mobile development with JavaScript
List and reviews of books, tutorials, and other resources helpful for learning Angular 2 and related concepts.
Solutions for locking down dependencies in npm. Learn to trust your dependencies and update/deploy without fear.
Overview Angular Universal builds on Angular ’s widespread adoption and support to provide server-side rendering and faster perceived performance to Angular applications. By pre-rendering an application at build time, or re-rendering at run time…
A guide to install/build/run/publish an Ionic2 application. This documents any gaps in existing guides. Publish a hobby web app to the app store in no time!
Using Bundled Webpack Instance with Gradle
Use locally installed node.js and npm instances with gradle
In this second installment on the MEAN stack, we are going to complete an integration between a service layer module written in NodeJS, and MongoDB as our document persistence.
This blog assumes you are new to MEAN, and would like to install the components, and build your first MEAN application.
Introduction With Angular 2.0 right around the corner, big changes are in store. If you would like to understand the differences between Angular 1 and Angular 2 check out this blog post ! For the past few years, building a Todo Application has been…
React.js is a promising new library for Javascript view component development. I will be comparing performance of Reacts virtual DOM rendering approach against native DOM manipulation in Javascript.
Relational data management with Lovefield
Solution to Spring Web Flow throwing parsing errors on jQuerys default request parameter for bypassing browser request caching.
Client-side geospatial analysis with TurfJS
Join us at Serendipity Labs in Chicago on August 20th for a 1 day ReactJS Workshop. The workshop is led by Object Partners Consultants that have been building JavaScript applications for years and love working with the latest and greatest front-end…
WebSockets are a long-lived, interactive, two-way channel between a client browser and end server that allows ongoing communication without polling.
A tour of how ReactJS works with plenty of examples.
A method of integrating bower into Gradle to manage JavaScript and CSS dependencies without maintaining copies in the source tree.
This past weekend, I was able to attend and present at the 2015 Nebraska.Code() Conference in Lincoln, along with a few other Object Partners developers. With roughly 500 in attendance from presenters, to attendees, to sponsors, the conference had…
With frameworks like Jasmine, Karma, and Grails, we can write Javascript tests and run them with grails test-app.
Using Apache Commons Pool from Groovy and Grails is an easy to use tool to configure an object pool on the JVM, especially for reusing expensive to create JAX-WS Web Service connections.
Extending Angulars $resource service to make it easy to declare resources and REST APIs. Wrapping the $resource service to normalize the REST calls to make it easier to work with promises and the $q service.
Learn how to use Spock, the powerful Groovy-based specification framework, to unit test your server-side JavaScript with style.
Android vs iOS is the wrong question. Our job as mobile consultants is to solve a business problem and use that solution to bring value to the client.
Running a Lightweight Static Server with Grunt
Discover the JavaScript equivalents of Groovy helper methods in the Lo-Dash library
Internet Explorer caps the number of CSS rules in a file, while Chrome throws a 404 on missing source maps. Customizing the Grails Resources plugin can help.
Project Avatar is a Web Framework for Java EE 7 and JDK 8 that runs under Glassfish. This post discusses how to build Avatar applications with Gradle.
Presentation Abstract: Application development on the web has drastically evolved over the last 15 years. Today web applications are often expected to act like natives apps, are JavaScript heavy, and need to work across mobile, tablet and desktop…
Easily accessing the HTML and objects of Bootstrap components by extending the jQuery prototype.
Using Services and Messages to Share Data Between Controller in AngularJS
Looking at the basic concepts of using D3 to manipulate the DOM.
The Angular.js JavaScript MVC framework has a powerful directive mechanism that can be used to create reusable HTML widgets.
A list of things that I wish were clearer to me when I started working with AngularJS
Information technology is moving faster all the time. But, if information technology is progressing rapidly, Why does it takes so long to do web development? How do intelligent technologists solve these problems? Share this infographic: http://www…
Sauce, which provides Remove WebDriver Browsers as a Service, or RWDBaaS. I may have just made up that acronym, but I am not making up this service. Its a great way to run automated Selenium-based tests against a large number of browsers. But automated cross-browser unit tests? Well, thats just one step removed and I would like to show you that.
Tired of boiler-plate code in GWT, wrapping your AsyncCallback interfaces can reduce that code; at least for AJAX calls.
Visit nearly any website these days and there will be one or more groups of social icons inviting visitors to share the site or page with a social network or to follow the sites related page or feed on a social network.
prettyPhoto is neat little jQuery plugin, that makes it easy to do lightbox style image (or videos, flash, YouTube, iframes and ajax) overlays on your page. The API documentation doesnt is sparse, but there is a way to open a list of images with an image other than your first one displayed.
JQuery Mobile provides tools to help you gain insight and understanding into global configuration values, page events, and page change timings in your app.
An example of processing forms containing both parent and child objects (one-to-many relationship) in Grails 2.
ConetD, a bayeux implementation, has a poorly documented feature that allows you to send information along with a subscription request: subscribeProps
When developing web applications, its very common for a confusing blend of JavaScript and framework code to make its way into the code.
Intelligent and careful use of JavaScript can enhance the user experience by providing not only the client-side functionality, but by completing the content.
An often overlooked operator, in JavaScript (and elsewhere), is the ternary operator.
It may happen that you need to open a second browser window to help your web application perform some additional action that you dont want to leave your current page to do.
Theres a little trouble putting JavaScript variable values into HTML form elements when those values contain HTML encoded characters. Heres a simple solution to that problem.
Using event handlers in Jquery UI Datepicker to return focus to the input field after date selection, while handling a quirk in IE that would reload the calendar window.
Manipulating HTML with Java and jsoup
JQuery Mobile SplitView plugin brings the powers of the Split-View interface to mobile web applications.
Step-by-step guide to a simple way to configure Eclipse WTP for Maven web app projects
A simple jQuery plugin to fire an event when a user finishes entering text in a text field.
Node.js is an evented I/O server built on Google’s V8 JavaScript engine. Node provides a simple way to build highly scalable server applications. This article will provide an introduction to Node along with installation details and a first server.
To scale applications, developers usually turn to multiple threads. This post discusses the use of single threading as an alternative.
How to track Grails web flow (or other dynamic) pages with Google Analytics.
With a fixed footer (using CSS position:fixed), you might make content invisible to your users. A workaround devolves into a discussion of the click event.
How to use the YUI3 global object instance and loader to help manage your custom modules and keep your code organized and optimized for reuse.
Apache Wicket is a component based framework for web development which uses convention over configuration.
The purpose of this article is to explain how to leverage Apache CXF and Maven to quickly generate client side web service bindings, and to detail a simple framework implemented on top of the generated classes to allow quick configuration of the client bindings at run time. In order illustrate thoroughly, a fictitious WSDL will be leveraged as a starting point.
The HTML5 specification has been in the works for several years and is getting close to reaching completion. This article gives a quick overview of what to look forward to when HTML5 is officially completed.
Bizarre JavaScript errors surfaced after upgrading Spring and Spring MVC. Heres what we found.
Here is a good example code for twitter like load more button in both jQuery and MooTools: http://net.tutsplus.com/tutorials/javascript-ajax/create-a-twitter-like-load-more-widget/ I’ve tried MooTools version and worked fairly well (For IE, you need…
A page layout using DIV’s are much more flexible than a table layout. However, I often went back to using tables because it seemed more stable across different browsers. After spending some time researching how to use DIV’s effectively, I came up…
As smart mobile phones such as the iPhone or the Palm Pre offer a better Web-browsing experience, it becomes easier to offer access to enterprise Web applications from these devices. Designing Web content for mobile devices isn’t that much different…
I recently came across this great JavaScript library called TextboxList by Guillermo Rauch which will convert good old input fields into Facebook like input fields. Even though there are tons of JavaScript libraries out there, it is very hard to…
At my current client I’ve been building a rather complex rich client app using ExtJs. The team has written a lot of JavaScript code, and has been writing a lot of JavaScript unit tests as well. We’ve gone through several unit testing tools along the…
I gave another presentation today on JavaScript Unit testing tools. This time I’ve advocated the use of HtmlUnit and Screw.Unit in combination. Screw.Unit is a JavaScript testing framework that’s great for unit tests, and HtmlUnit has…
JavaScript is a nice fit on the Grails platform. This demo/presentation provides a side by side comparison of Ext JS and GrailsUI approaches to building feature rich web applications on Grails. Feel free to look at the presentation slides, as well as…
My OPI Tech Talk, on the Yucky Parts of Web Development, is available as a Powerpoint presentation . In the talk, I spoke on how a few techniques can give you a jumpstart for the Web side of your applications. The focus was on using these techniques…
An overview of some testing frameworks for full-featured Javascript Libraries JavaScript Testing Presentation Examples: presentation.zip musicmanager.zip Abstract: Making the move from sprinkling simple interactive Ajax controls into basic web…
This presentation discusses some of the fundamental concepts of Grails and dives into an example that demonstrates how to build RESTful Web Services with Grails. Select the link below to download the full presentation. Intro to Grails with RESTful…
Typical Web pages use one or more ways to lay out pages. The most common means are table-based layout and CSS layout. CSS layout means you use CSS styles to place major blocks of your page at certain locations. For example, the footer gets placed at…
In my OPI Tech Talk on Jan 28, 2009 on the Yucky Parts of Web Development, I covered a very simple technique you can use to create mouseover effects for tabular data. If you want to use the small interaction style mentioned in my talk, or if you just…