Our Blog

Ongoing observations by End Point people

A Project Manager’s Toolkit

By Elizabeth Garrett Christensen
November 16, 2019

Banner

I do a lot of project management work related to web applications. Everyone assembles their own set of useful productivity tools and I’m feeling pretty good about how I’ve got things set up at the moment so I thought I’d share my secret sauce. I’m interested to hear what other people have found useful as well so feel free to share in the comments.

Chat Tools

Ok, this one is all over the map. Slack is obviously the big one and many of our clients use that with us. Most larger organizations incur a cost (smaller projects are free). Internally End Point uses Zulip, which is a pretty decent open source application. Zulip doesn’t have as refined a user interface as Slack, but it works for our needs, and also has a mobile app I can use on the go.

I also highly recommend Skype. While it’s not the best system out there, so many people use it, it is almost impossible to avoid. Skype is really easy way to get someone’s attention and I use it with a lot of my clients for quick one-on-one questions and chats. Google Hangouts chat is also really nice for working with external folks and will run in your menu tray and mobile phone, so you can stay up to date wherever you’re working.

Video Calls

I spend a few hours on the phone a day and my go-to system at the moment is Zoom. End Point often uses Google Hangouts or Meet, but those require a Google account, which can be a burden for some clients or contacts who aren’t Google-ified. Zoom is pretty cost effective and lets you connect with someone via video chat or phone and even provides local numbers for your participants all over the globe. This is not only a great system for large group meetings, it is excellent for initial meetings or situations where you’re unsure if your group needs a phone or video call. Each participant can choose for themselves. It’s also technically the most stable and is far better about maintaining solid connection (for my OS/browser) when compared to Skype or Google Meet/Hangouts. I...


tools

Winning with CSS Grid and Autoprefixer

By Greg Davidson
November 4, 2019

Aerial view of St. Vitus Cathedral, Prague

Photo by Stijn te Strake on Unsplash

Using CSS Grid Today

Support for CSS Grid is excellent (over 90% globally! 💯). I have been using it in a variety of client projects for the past few years with great success. The combination of CSS Grid and Flexbox has made layout on the web much simpler, more fun and less frustrating compared to the hacks techniques which were used for CSS layout in the past. Definitely give it a try if you haven’t already done so.

IE10 and IE11 support an earlier version of the CSS Grid spec and with help from Autoprefixer we can reap the benefits of CSS Grid in those old browsers with a little bit of extra work. I’ve long been a huge fan and happy user of Autoprefixer. It’s a PostCSS plugin that examines your CSS and augments it with vendor prefixes and alternative syntaxes. Although vendor prefixes (e.g. -webkit, -moz, -o, etc.) are much less common these days, there are a few still in use.

CSS Grid Basics

With CSS Grid the basic idea is to define the grid, i.e. the rows and columns that make it up, and then go about placing elements on the grid. Think of a website layout with a masthead, navigation, hero image, main content sidebar, and footer as an example. Your grid styles can specify where each of these elements should be displayed on the grid: how many rows or columns they span, etc. In addition to this method of explicitly placing elements on the grid, auto-placement places elements on the grid for you automatically.

Autoprefixer + CSS Grid

I recently learned how to use control comments in Autoprefixer to get fine-grained control over the way it operates on and enhances my CSS Grid styles. Rather than specifying a single (global) behavior via config options, control comments let you tell Autoprefixer how you would like it to process individual blocks of CSS code. For the scenario where I was explicitly placing elements on my grid I used the following control comment in my CSS file:

/* autoprefixer grid: no-autoplace */

This...


browsers css tools development

Rails Exception Notification and Logging

By Patrick Lewis
October 31, 2019

Railroad tracks Photo by Randen Pederson, used under CC BY-SA 2.0, cropped from original.

Exception handling is an important component of any Rails application that is intended to be deployed in a production environment.

If you have ever felt your heart sink because you received a screenshot of your Rails application with this dreaded “something went wrong” message from a customer or client, you know what I’m talking about:

Rails application error

Though developers strive to deploy projects that are free of bugs and never throw an exception, the reality is that people using your Rails applications do sometimes encounter errors. When that happens it’s better to have your application automatically notify you of the event, rather than finding out about it for the first time when someone calls or emails you.

Exception Notification

The Exception Notification gem is a stalwart of the Ruby/​Rails ecosystem and the standard solution for configuring your Rails project to notify you when errors occur. I typically use the gem to deliver notifications to a development/​hosting team via email, but it has a variety of built-in notifiers that can output to just about any location you would want: Slack, IRC, Amazon SNS, etc., plus an option to write custom webhooks for other services that are not supported by default.

Exception Notification is simple to install and configure, particularly for Rails applications where it can be installed as a Rails engine and configured via an initializer. The default config/initializers/exception_notification.rb initializer generated by the gem comes with an example of an email notifier:

# Email notifier sends notifications by email.
config.add_notifier :email, {
  email_prefix: '[ERROR] ',
  sender_address: %{"Notifier" <notifier@example.com>},
  exception_recipients: %w{exceptions@example.com}
}

along with examples of other configuration options for conditions to determine which errors should generate notifications and some examples of other notification providers.

Starting...


ruby rails monitoring

Project On-ramping: Infrastructure and Codebase

By Steph Skardal
October 21, 2019

Aerial view of New York City from satellite Photo by NASA via Unsplash

Living in the consulting world, we often jump into codebases and environments to get quickly up to speed to provide estimates or start fixing bugs right away. Here are some important landmarks I visit along my way to get up to speed on a new project.

Dev stack

First up, I learn as much as I can about the dev stack a codebase runs on. It used to be the case that LAMP (Linux, Apache, MySQL, PHP) was a pretty common setup in our world, but the number of dev tools and variety in stacks has expanded greatly over time. Many of my End Point clients are now running nginx on Linux, with Ruby on Rails and MySQL or PostgreSQL, but as a company we have both breadth and depth in web stack technologies (hover over the Expertise dropdown above).

Layered on top of the base infrastructure might be a JavaScript framework (e.g. React, Ember.js), and other abstractions to improve the dev process (e.g. Sass, Node.js). And layered on top of that further is the possibility of other services running on the server locally (e.g. search using Elasticsearch or Solr) and 3rd-party tools running on a server elsewhere (e.g. content delivery networks, monitoring, Stripe).

The web stack and 3rd-party tools can be so complex these days that there is a lot of ground to cover before jumping into the code.

Personnel infrastructure

Next up, I like to understand how our client works with the website and more about their limitations (time, technical, other). Especially in the consulting space where we are supporting existing developers, I think it’s important to exercise empathy over how they’ve gotten to the point they are at, and why they’ve reached out for additional development resources.

Does the client want a solution that enables them to make their own changes moving forward, i.e., a content management solution? Do they want to hand the project off entirely due to time limitations? Is there a hybrid solution that will enable them to make changes and defer to us...


rails clients development

Seeking a PHP developer

By Jon Jensen
October 17, 2019

decommissioned pay phone

We are looking for another PHP software engineer, to work with us during business hours somewhere in the UTC-7 to UTC-4 time zones (U.S. Pacific to Eastern Time). This is a contract-to-hire role, and can be full time or part time.

End Point is a 23-​year-old Internet technology consulting company based in New York City, with about 50 employees, most working remotely from home offices. We collaborate using SSH, GitLab, GitHub, chat, video conferencing, and good old email and phones.

We serve many clients ranging from small family businesses to large corporations.

What you will be doing:

  • Develop new web applications and support existing ones for our clients
  • Work together with End Point co-workers and our clients’ in-house staff
  • Use your desktop OS of choice: Linux, macOS, Windows
  • Use open source tools and contribute back as opportunity arises

What you bring:

Professional experience with web application development and support:

  • 5–7 years of development with PHP (older 5.x and newer 7.x versions) and JavaScript
  • Frameworks such as Symfony or Laravel
  • Databases such as PostgreSQL, MySQL, MongoDB, Redis, Solr, Elasticsearch, etc.
  • Security consciousness
  • Git version control
  • Automated testing
  • HTTP, REST APIs, and/or SOAP
  • Magento experience is a plus!

And just as important:

  • Strong verbal and written communication skills
  • A good remote work environment
  • An eye for detail
  • Tenacity in solving problems
  • Ownership of projects to get things done well
  • Work both independently and as part of a team
  • Focus on customer needs

What work here offers:

  • Flexible work hours
  • Annual bonus opportunity
  • Freedom from being tied to an office location
  • Collaborate with knowledgeable, friendly, and diligent co-workers around the world
  • For full-time staff: paid holidays and vacation
  • For U.S. employees: health insurance subsidy and 401(k) retirement savings plan

Getting in touch with us:

Please email us an introduction to jobs@endpoint.com to apply. Include your location, a resume/​CV...


company jobs php remote-work

Custom cabinets for the Liquid Galaxy

By Ben Witten
October 1, 2019

Liquid Galaxy installation encased in a wood cabinet

End Point is proud to announce a new offering in its product line: Liquid Galaxy systems built into beautiful custom cabinets! Our first custom cabinet was created and installed at Auburn University’s Ralph Brown Draughon Library this past month. Both we and the University are thrilled with the success of this install.

Cabinets provide a perfect hybrid solution for clients who want the look of permanence and grace that comes with a wall-mounted system, but are somehow limited by their physical space. Until now, clients were given options of an entry-level system on a portable aluminum frame (great for those in need of moving displays to various locations) or permanent wall-hung systems that are a build-out of a curved reinforced wall.

In the case of the recent installation at Auburn University (pictured top), the library staff elected to have a cabinet built because the wood-grained structure was more conducive to the architectural integrity of their beautiful library and the popular location they wanted it to be in.

Since 2012, the Liquid Galaxy immersive visual platform has been a primary focus for End Point. Since our first installation at the Smithsonian National Air and Space Museum, we have installed and supported many types of systems ranging from 3 to 48 screens. These systems have expanded across 20 countries and 6 different continents! We have supported many customized and innovative projects, including these:

Liquid Galaxy in a flat layout

Liquid Galaxy in a conference-room layout

Liquid Galaxy Liquid galaxy in a 2x7 cylinder layout

Liquid Galaxy in a traditional 1x7 cylinder layout

Whether portable and free-standing, permanent in-wall, or built within a beautiful cabinet, End Point has a full complement of options for meeting our clients’ installation, exhibiting, and business needs. The new cabinet offering can ease and accelerate your decision-making considerations by not having to renovate existing walls, or build new additions to a space.

Liquid Galaxy cabinet diagram

We are very happy with the success of our new cabinet offering and look forward to developing and installing more cabinets and Liquid Galaxies for our clients. Please do...


liquid-galaxy

Google Drive for virtual machine images

By Jon Jensen
September 30, 2019

Pine Creek Pass, Teton Valley, Idaho

Recently we decommissioned an old database server. We wanted to keep a copy of its 53.7 GB virtual machine disk image in an archive in case there is ever any need to revive it. It is really unlikely that we will need it any time soon, or maybe ever, so we thought of putting it in one of the cloud storage services.

Cloud storage

Cloud service pricing is often metered by storage, network, operations, and other fees, making it complicated to calculate what you will pay. We already use Amazon S3, Azure Storage, and Google Cloud Storage and they are all no exception. For our example 53.7 GB disk image, the Google Cloud Storage Standard Storage pricing is currently:

  • No charge for network ingress when we upload it
  • About $1.08 to $1.40 USD per month to store the file in the US or EU
  • About $6.50 each time we download the file to most places in the world!

These days a ~50 GB disk image is on the small side, so you can imagine the cost going up rapidly with larger disk sizes.

Some cloud storage providers offer lower prices for slow-availability semi-offline storage, such as Amazon S3 Glacier or Google Coldline Storage. Those would indeed save us some money for monthly storage, but the most expensive aspect is the network egress cost, which is the same.

Local storage

External USB disk drives have gotten very inexpensive in recent years, so we considered just spending roughly $180 for a 6 TB hard disk and storing our disk image there. We can fit over 100 VM images of this size on such a disk, so the cost works out to a one-time cost of about $1.80 each.

But there are downsides to local storage, including:

  • It is a single point of failure. The disk can:
    • fail
    • be lost or stolen
    • be damaged by water, an impact such as someone dropping it or a horse kicking it 🐴😀, or a power surge or static electricity
    • be forgotten if the employee who has it leaves and nobody remembers to take it over.
  • The data would likely be inaccessible while the employee is out of the office.

sysadmin cloud storage

React: Style Tips

By Zed Jensen
September 28, 2019

Icon design
Photo by Harpal Singh on Unsplash

I’ve worked on a couple of large React projects over the last few years. In my experience, one of the trickiest parts of getting a React project up and running is figuring out how you want to visually style your application in the browser, so I’ll share in this post some of the ways I’ve styled my projects.

CSS Modules

Libraries like Material-UI (which I’ll discuss next) do a lot of the work of styling for you. However, sometimes you’ll still need to define styles unique to your project, and the most common way is with CSS.

For projects created with create-react-app, any CSS you include in a React project isn’t scoped. This means that if you define a class tall in one component that has a height of 40 pixels and a class tall in another component with a height of 80 pixels, one of your rules will overwrite the other—whichever makes it into the compiled CSS file last. However, Webpack allows you to use CSS modules, which restrict your CSS rules to components that explicitly import them. It took me a long time to figure out how to use them due to lack of relevant documentation, but eventually I discovered a very easy way to do it.

If your file structure looks like this:

- app/
  |-App.js
  |-App.css

It’s as simple as renaming your CSS file like this:

- app/
  |-App.js
  |-App.module.css

Using the suffix .module.css tells create-react-app that the rules within should be scoped only for where they’re imported. They can be used like other styles by importing and passing the classes like this:

import styles from './App.module.css';

export default function Component(props) {
  return <div className={styles.myClass} />;
}

Material-UI and similar libraries

There are many different design philosophies for web, but probably the most popular is Google’s Material Design. Material Design lays out some rules that help keep a user interface uncluttered, intuitive, and pleasant to use. However, jumping into the guidelines on Google...


javascript react css
Page 1 of 183 • Next page

Popular Tags


Archive


Search our blog