Hosting Umbraco 7 on AWS Elastic Beanstalk

Previously at work, our marketing websites were all designed up front, with copy provided by our colleagues in Marketing and then the pages were generated by the development teams. Because this was taking our developers away from the tasks where they can add real value to the customer journey by streamlining the end-to-end process, it was decided that the company would benefit from introducing a CMS solution with which the Marketing team and Content Writers would be able to manage content themselves.

No executable found matching command "dotnet-lambda"

When packaging up a dotnetcore lambda function for deployment to AWS, you would run the following command:

dotnet lambda package -o ../../build/{DestinationFileName}.zip

However, when I ran this command earlier today on a new Lambda function project, I got the following error:

No executable found matching command "dotnet-lambda"

This is because the Amazon.Lambda.Tools package isn’t being included in the dotnet build process, so to fix things, I had to edit the .csproj file for the Lambda function to include the following:

Umbraco 7: Create a custom Property Editor

Recently, I’ve been working on creating an implementation of Umbraco CMS for the Marketing team at work to use for quickly creating content for promotions etc. and the SEO Manager has asked what we could implement to benefit them in terms of SEO (Search Engine Optimisation for those who don’t know).

Requirements

Now, until working on this, I knew what SEO was, but had no idea what it entailed, so working with the SEO Manager, we outlined the following requirements for our initial (MVP) release. He needed to be able to edit the following:

React.js Unit Testing with Jest and Enzyme

I’ve written loads of unit tests in my lifetime for C# and JavaScript, but never gotten around to writing any for testing the actual React components because there’s always been something more pressing. Time to put that right and take the plunge.

So I’ve picked up the project which resulted from the React.js Continued… State! tutorial as a starter for ten as it already has a lot of the boilerplate stuff in place.

Map() support in JavaScript ES6/ES2015

ECMAScript 6/2015 has brought a lot of new things to the world of JavaScript, and Map() is one of them. However, not all browsers are too keen on particular ways of using it.

I’ve been working on a UI project at work this week and encountered a weird issue with some code written by a colleague. We have some scenarios in our React app where we need to translate/map some values from an integer to a string (for textual display in the rendered screen). We tend to use Map() to do this and for the most part it works fine, until today!

iPad appears in Windows 10, but not showing in iTunes

I have an aging iPad2 which is getting on a bit but still works fine, but often won’t appear in iTunes, but is showing in Windows 10 as a device in ‘This PC’.

I find it usually happens after an iTunes update when the iPad was plugged in already, and it seems Windows throws in a generic driver when the Apple drivers are removed as part of the upgrade process. To solve the problem, I do the following:

Rendering an array of data as a clickable list using React.js

React.js is great for quickly rendering arrays of data in a tabular format, and there’s loads of grid-like packages out there in npm, but sometimes you just need to hand-crank something yourself. Which is fine, until you want the row to be clickable…

So how would you usually render a page from an array of data? Well, I’d probably start with some form of iterating the array and building up the content that way. I’ll explain how I’d go about doing this now.

React.js Tutorials

I’ve created a few pages on here which are now growing into a bit of a tutorial, so thought I’d collate the links into one post (and append links to any new related posts in the future) so it’s easier to follow.

So to start off, I’ll rewind back to November 2015, when I created my Getting Started with React.js post. This was using JSX and ES5, along with Browserify to “compile” the code to “Vanilla JS” which the web browsers support. Fast forward now back to this year (2017), and I’ve created an update post to that, along with a few subsequent posts that take the journey a few steps further.

React.js Continued... State!

This time I’ll be looking at State. What it is and how to use it… Like last time, we’ll be continuing with the code from the previous post.

Last time we created 2 components, home (which was a stateful component) and header (which was a stateless component). This time we’re going to handle state within the home component by calling an API. As in previous posts, I’ll be using the UK Police API as it doesn’t require any authentication (or at least it doesn’t at the moment, that could change!) which cuts down on fluff.

React.js Continued... Components!

It’s time to continue on from my React.js Revisited post that I made a few days ago. This time we’ll look at creating some components…

So what exactly is a “Component” in the context of React.js? In my head, I visualise React.js a little like Web UI Lego. The idea is you build your web application in blocks which are then built in a way which suits you and your application. A component is therefore like your Lego brick. They can be the bigger 4x2 stud ones, or those tiny 1 stud ones that cripple you when you stand on it with bare feet at night :'(