Shopping for the best laptop for web developement

As a developer with a diverse background in IT and web development, I prefer to purchase a solid laptop that will serve me for 5-7 years rather than replace it every 1-2 years. This is because it takes me over a week to install and configure all the software, tweaking the registry and getting things working just the way I need it. It's been getting better since I discovered Ninite and Chocolatey but I still prefer not to do it any more than I have to.

Another advantage is that, by the time I am through with a laptop and ready to replace it, it is still good enough for me to pass on to a typical non-programmer user for browsing the web, email, social media, watching videos and typical computing tasks.

With that in mind, here is my advice for buying the best laptop for web development…

The best laptops for Web Developers

As others have mentioned, go with business class. They are built so much better and are more reliable that consumer class machines. That said, if you are a student on a tight budget, you may need to compromise. Just make sure they are compromises that you an live with.

The Macbook Pro is probably the most versatile platform. You can run OS X (which runs on Unix), Windows and even Linux if you really wanted to. You can also develop for iOS AND Android. These machines are also very well built. If you are not sure what you will be working on, this is probably the most flexibility option you will find. I don't personally use a Macbook Pro but know many web developers who love these machines.

That said, I've been using Thinkpads for over a decade. Every time I go out shopping (I really do my homework), the best option has always ended up being Thinkpads. I think the Lenovo Thinkpad P50 is your the best option. It replaces last year's Thinkpad W540.

I actually have high hopes for the Retro Thinkpad, hopefully coming out later this year or next year for the 25th anniversary of the Thinkpad. I hear that it's going to have a the famous classic 7 row keyboard, 16:10 ratio screen, dedicated volume controls, cursor navigation keys in a layout that makes sense, as well as with many other highly desirable modern features that have been missing from the Thinkpad line since the T520 and W520.

Thinkpads are not usually on the bleeding edge of technology. However they are solid and often well thought out machines. After using them for a while, you start to realize the rational behind many of the choices that go into their design… except for the trackpad which was terrible for the last few years but is starting to get better on select models.

It's not going to help you with your needs today but, if you can hang on to your current laptop a little longer, it might be well worth the wait.

If you want something to tide you over or are a student on a tight budget, look for a used 2.4 GHz Thinkpad T520 or W520 with i5 (dual core) or i7 (quad core), a screen resolution of  1600 x 900 or higher and 8 GB of memory. Add an SSD drive to it and this machine perform just about as well or even run circles around many of laptops sold today.

Keyboard

Typing on a poor quality keyboard will actually slow you down and result in more typos. There is nothing like working on the legendary quality keyboard found on a Lenovo Thinkpad in my opinion. They just feel great and, if I am going to be typing 8-15 hours a day, I want my fingers to be happy. Go to a store and type a page of text. After doing this on a few computers, you'll quickly realize that not all keyboards are the same. Don't forget lighting for the keyboard. Programmers often work until it's dark outside. A well lit keyboard can be less disturbing to those who are sleeping than having a bright light on. Try typing on a perfectly flat keyboard with the lights off. It's a lot harder than one might think. Get good overhead or back lighting for your keyboard. If you live in Canada, note that most laptops sold in this country seem to have the multilingual keyboard layout with the bigger inverted L shaped enter key (and some keys shuffled around). If you are used to a US keyboard layout, look for it specifically. Finally, make sure that you can activate the function F1-F12 functon keys by default. Although most of the world rarely uses these keys, developers use them all the time and it quickly becomes a pain to have to press the Fn key in addition to one or more keys in order to activate functions keys.

Trackpad

Don't just look at it, try it out. Is it responsive? Can you scroll with it? Is it multi-touch?Does it have mouse physical buttons that are not just part of the trackpad? Try dragging and dropping something. Try right clicking. I prefer to use the little red trackpoint in the middle of Thinkpad keyboards but hey, everyone has a preference. I also have a separate wireless mouse in which case the trackpad may not be important at all. I think it still is because I don't always have my mouse with me.

Memory

If you don't need to run a local web server or virtual machine, 8 GB should do just fine. Otherwise go for 16 GB. When ordering your computer with 8 GB, make sure it is just one memory module so that you can add another at a later date. Otherwise you may need to remove one or both of your 4 GB memory modules to bring it up to 12 or 16 GB in the future. Also compare the price of the laptop with less memory and adding 3rd party memory vs getting it fully loaded. You may discover that you can save quite a bit of money by doing an post-sales upgrade.

Storage

I can't be objective here anymore -- I admit that I am an SSD drive junky. I am so used to these that it is actually painful to go back to an HDD these days. When you run out of memory, swapping memory to disk also has much less of an impact. How much space will you need? What ever that number is, double it or you will very likely run out of disk space over the lifespan of the computer. My research has also shown that Samsung 850 Evo SSD drives to be much more reliable over the long term than others. Otherwise, plan on replacing your SSD drive every 2-3 years to ensure it doesn't fail.

CPU

Minimum i5 -- don't even look at an i3! Choosing between an i5 vs i7 really depends on the type of programming you will be doing. The only time you should consider an i7 is if you are looking at a quad-core for better performance. A dual core i7 is more expensive and provide little performance gain over dual core. Intel is the standard on both Windows and Apple OS X laptops. AMD? If something doesn't work, will you ever feel confident that the problem isn't the result of you wanting to save a few bucks? Being able to rely on my tools is paramount to me. I know people who shop at the other end of the pricing spectrum and they are forever wondering why their computers aren't reliable.

Video chipset

If you are going to be developing games, you'll want a faster video chipset. If you are just doing web development, the Intel video built into a CPU will do just fine and is much more likely to be supported in the future than niche high performance video chipsets. I made that mistake once. It was fine until I upgraded the operating system and discovered that the manufacturer didn't come out with updated drivers. That said, if you play games in your time off, it might be worth spending a couple of hundred dollars for a computer that will address both your needs for work and play.

That said, my laptops have always been pretty solid over the years -- except when I start installing games on them. Might just be a coincidence but I'm just saying that I noticed a pattern. As long as I keep games off my laptop, I very rarely seem to have problems with it. Be concious of what you install on your laptop. If you just want to try trial software out, do it in a virtual machine and only install it on your computer's operating system when you feel confident with it. That's what trial software is for… to try it.

Display

I recommend a minimum of 1600 x 900. Anything less and you will always feel like you don't have enough space on the screen to work… even if you have a second display. I made that mistake once. I was lucky that it was possible to upgrade the display on my Thinkpad by just replacing the LCD. That's not always possible. Seriously consider 1920 x 1200 or better. You can always reduce the resolution but you can't always raise it. While glossy screens are fun to watch, matte anti-glare screens are much easier on the eyes especially over many hours. A wide horizontal and vertical viewing angle is also a god send. Personally, my ideal screen is 15″ but I know a lot of people who like the portability of laptops with a 14″ screen… if you also have a nice big 23+ inch external monitor to work on most of the time. Other factors to consider include brightness (brighter and better contrast is needed if you are in a very bright environment) and colour gamut. Some might say that colour gamut isn't that important however, the day you have two screens connected and notice that blues and reds look purple and orange on your other screen, you'll be wishing you had a laptop with a better screen gamut to be sure which colour you are using. When you know you are seeing the right colours, you can feel safe telling others that it's their screen that is displaying the colours wrong. Finally, there is the issue of touch screens. Touch interfaces may not be perfect yet but they are definitely on the books for the future. Tablets, smartphones -- if you want to make sure your websites work with these technologies, it is probably wise to get a laptop with touch screen if you can afford it.

Battery

Most quality laptops should get you through an 7-8 hour day these days. It only becomes important if you are going to be away from a power source for extended periods of time. That said, keep in mind that after a while, the battery won't be able to store as much power and will likely only last half that time or less. Bonus if the battery can be replaced without having to send it out for service.

Audio

You are probably going to have external speakers or wear headphones anyway so don't worry about this too much. Do listen closely to the computer sound. Make sure there is no distortion. When testing, listen to both music and to sounds. Noisy chips in the computer and SSD drives, and annoying noisy fans can really get on your nerves after a few hours. While fans do make some noise, it's the solid state chips that really surprise me as sources of noise since I changed to an SSD drive. Also make sure that there is no sound coming from the laptop when the speakers are muted.

External Connectivity

Don't even look at a laptop that doesn't have USB 3.0 connectors, preferably at least 3. You will live to regret it. HDMI is nice because you rarely need adapters but DisplayPorts tend to be more versatile. You can always get a DisplayPort to HDMI adapter. VGA is finally on the way out so get HDMI or DisplayPort if possible. Audio jack is nice but as soon as you get tired of the wires, you'll start looking at Bluetooth so make sure it is included (some laptops still don't). WiFi, G/N/Dual AC should be standard. G for backwards compatibility and Dual AC for the future. Optical drives are no longer worth including for the limited number of times you need it these days. Get an external DVD/RW drive instead if you think you will you need it.

Biometric Scanner (a.k.a. Fingerprint reader)

I tend to log in and out of many websites several times in the course of a workday. Many developers keep all their passwords in Word documents which is hopefully at least password protected itself. However what stopping anyone from peering over your shoulder as you look at your list of passwords on the screen? When used together with a password manager like Roboform, a finger print scanner can not only save you the time it takes look up and type your passwords dozens or even hundreds of times a day, it will also reduce any chance of people learning your passwords as they watch over your shoulder while you type. Your manger or clients will also feel better about trusting you when they realize that you don't type any passwords in plain view of other people. Tip: Make sure the password manager you intend to use works with the fingerprint scanner built into your laptop. True, there are USB fingerprint scanners but how long do you think it will take before someone just pulls that baby out and walks away with it?  Better to have it built-in.

Docking Station

This is optional but I find it very convenient if I need to regularly disconnect and reconnect all the peripherals plugged into my laptop. Some docking stations just connect to a single USB 3.0 plug on most laptops while your whole laptop can sit in others (like with a Thinkpad). The later has the added bonus of putting your keyboard on a slightly more comfortable angle and often comes with its own power supply.

Power supply (a.k.a. power brick)

Check out the size of the power supply, especially if portability is important to you. Some laptops literally have a power supply almost the size of a real red brick. If you don't check before you buy, you might be surprised at the size of it when you open the box. Also, if you do need to travel once in a while, it can be well worth purchasing a extra power supply that you can keep in your bag. This has saved me on many occasions from arriving at work just to realize that I forgot my power supply.

Cost

If you are going to be making money using this machine, don't skimp. In the long run, it's worth spending a little more on tools of your trade, whether it is hardware or software as your choices affect your productivity, how happy you are to go to work and how comfortable you will be. Clients will also judge you by the professional equipment you use.

Is a quality professional computer really that expensive of an investment when you consider that it will be used to generate potentially hundreds of thousands of dollars over its lifetime? Compare the price of a $3,000 laptop to your total income over the next 5 years. Then take the $3,000 laptop and divide it by 5 years and then again by 365 days and realize that it is only costing about $1.65 per day.

You probably spend more on coffee every day. Have one latte less and get yourself some professional grade tools.

Creating Linux dot files in Windows

Ever tried creating a file Linux style dot file like .htaccess or .gitignore in Windows Explorer? It gives you a "You must type a file name." error message. This might lead people to think that Windows doesn't support these file names. If you use a command line, you know that this is definitely possible in Windows. In fact, you can even create dot files in Windows Explorer quite easily with this little know trick.

To create a filename that start with a period "." but has no extension, like .txt, simply add a period to the end of the filename.

For example, enter the file name:

    .htaccess.

…to create:

    .htaccess

Windows will automatically drop the trailing period for you but completely forget that there is nothing before the leading period.

This tip also work when renaming files. For example, you can rename htaccess.txt to .htaccess

May the world overcome bigotry and prejudice, and find peace, love and acceptance in 2016

Respect for others seems to be a fleeting quality at times… but then, just when you least expect it, the best in people comes out restoring faith that things can change.

There will always be bad apples out there and people need to stop associating good folks with the bad just because they might share some physical or cultural similarities. May the world overcome bigotry and prejudice, and find peace, love and acceptance in 2016.

Best regards,

Michael Milette

It’s not about the nail

There was so much conflict in the world this year (2015). At an early age, I was taught to use my words instead of aggression. What if people all around the world started talking instead of fighting and trying to blow each other up? It still wouldn't help unless we learn to really listen to what others have to say.

In this brilliant video entitled "It's not about the nail", can you see past the hilarious interaction and really get as a man from her perspective and as a woman from his perspective?

 

Useful WordPress Contact Form 7 Field Definition Templates

Here are some useful field definitions for use in WordPress Contact Form 7 that are useful when collecting mailing addresses.

Canadian Provinces (English / 2 characters )

<p><label for="province">Province (required)</label><br>
[select* province id:province include_blank "AB" "BC" "MB" "NB" "NL" "NS" "NT" "NU" "ON" "PE" "QC" "SK" "YT"]</p>

Canadian Provinces (French / 2 characters )

<p><label for="province">Province (required)</label><br>
[select* province id:province include_blank "AB" "BC" "MB" "NB" "NL" "NS" "NT" "NU" "ON" "PE" "QC" "SK" "YT"]</p>

Canadian Provinces (English / Full names)

<p><label for="province">Province (required)</label><br>
[select* province id:province include_blank "Alberta|AB" "British Columbia|BC" "Manitoba|MB" "New Brunswick|NB" "Newfoundland and Labrador|NL" "Nova Scotia|NS" "Northwest Territories|NT" "Nunavut|NU" "Ontario|ON" "Prince Edward Island|PE" "Quebec|QC" "Saskatchewan|SK" "Yukon|YT"]</p>

Canadian Provinces (French / Full names)

<p><label for="province">Province (obligatoire)</label><br>
[select* province id:province include_blank "Alberta|AB" "Colombie-Britannique|BC" "Manitoba|MB" "Nouveau-Brunswick|NB" "Terre-Neuve-et-Labrador|NL" "Nouvelle-Écosse|NS" "Territoires du Nord-Ouest|NT" "Nunavut|NU" "Ontario|ON" "Île-du-Prince-Édouard|PE" "Québec|QC" "Saskatchewan|SK" "Yukon|YT"]</p>

Australian States (English / 3 characters)

<p><label for="state">State (required)</label><br>
[select state id:state include_blank "ACT" "NSW" "NT" "QLD" "SA" "TAS" "VIC" "WA"]</p>

United States of America -- USA (English / 2 characters)

<p><label for="state">State (required)</label><br>
[select state id:state include_blank "AK" "AL" "AR" "AS" "AZ" "CA" "CO" "CT" "DC" "DE" "FL" "FM" "GA" "GU" "HI" "IA" "ID" "IL" "IN" "KS" "KY" "LA" "MA" "MD" "ME" "MH" "MI" "MN" "MO" "MP" "MS" "MT" "NC" "ND" "NE" "NH" "NJ" "NM" "NV" "NY" "OH" "OK" "OR" "PA" "PR" "PW" "RI" "SC" "SD" "TN" "TX" "UT" "VA" "VI" "VT" "WA" "WI" "WV" "WY"]</p>

Have a favourite you would like to add to this list? Drop it into a comment below.

Best regards,

Michael

Bug in Chrome Renders WordPress Admin Menu Incorrectly (fix included!)

Do you work in WordPress using Chrome? If so, you may have recently noticed that the sidebar admin menu gets messed up bit when you hover over menu items or just work in it for a few minutes.

I haven't noticed if this bug affects other websites.

The Problem

Notice that there are menu items overlapping others, menu items missing and as you hover over them, they may fix themselves temporarily or move on you.

This is a bug specific to Chrome which first appeared in v45 (the current version). The Chrome team has has discovered that the problem is related to a specific commit to the Chrome code that "Enable Slimming Paint by default in Chromium and Blink".  Although the issue has been assigned, I sounds like they've marked it for the v47 release, as v45 is already released and v46 is currently pushing through.

This bug makes it very difficult to perform any work in the backend of WordPress using Chrome.

The Solution

The good news is that there is a simple workaround which simply involves disabling the new Slimming Paint code.

Here is how:

  • In Chrome, go to the following URL: chrome://flags/#disable-slimming-paint
  • Enable the "disable slimming paint" setting and ensure that the "enable-slimming-paint" setting immediately below it is not turned on.
  • Chrome will need to Relaunch to save the setting.

Once you have done so, the bug will be gone.

If you prefer not to do this, you can clear up the issue for a few seconds at a time by collapsing and uncollapsing the side menu using the link at the bottom or use any other web browser. As I said, the issue is specific to Chrome.

For more information on this bug is available.

Best regards,

Michael

Figuring Yourself Out with Self-Discovery

Been on the road to self-discovery for a while? Don't be too hard on yourself. People are always changing as a result of their life experiences, whether they realize it or not.

So don't be too surprised if, shortly after you think you've figured yourself out, you discover that you didn't get it quite perfect.

This goes for trying to figure out other people as well.

--- Michael Milette

Creating Multilingual Moodle Content With mlang Tags

My experience with the Moodle LMS has involved dealing mostly with multilingual sites. Unfortunately there are still many core Moodle plugins and third party plugins and themes that still do not support multilingual content. However the situation is improving with each code release.

One Moodle plugin which has made life a lot easier when implementing multilingual courses is the Multi-linugual Content (multilangsecond) filter by Vanyo Georgiev. Unlike the core HTML based Multi-language Content filter plugin that comes bundled with Moodle, multilangsecond has a non-HTML syntax that enables you to wrap your content in plain text language markup tags like {mlang en}Hello{mlang}{mlang fr}Bonjour{mlang}. Entering these tags require no knowledge of HTML at all. Unlike the Multi-language filter which only supports inline content using HTML <span> tags, multilangsecond also supports block mode so you can do things like this:

{mlang en}
Put many paragraphs of English content, lists, images and just about anything else in here.
{mlang}{mlang fr}
Put many paragraphs of French content, lists, images and just about anything else in here.
{mlang}

Taking this one step further, Iñaki Arenaza recently enhanced multilangsecond with a new yet to be released plugin called multilang2 -- currently only available on GitHub. The main difference is that is optimized by dropping support for the older HTML syntax. The more important new feature is that you no longer need to have multiple languages.

For example, say you have content which is only available in English on a multilingual site. You might want to add a note that will only appears when students access the page in French. You could accomplish this by adding something like {mlang fr}Disponible en anglais seulement{mlang}.

Notice that the {mlang} tag syntax is 100% backwards compatible with the multilangsecond plugin? Sweet! Got to love it when you don't have to go through a migration process to upgrade.

This all seems far simpler than the old multi-lingual filter and I have to tell you that instructional designers really appreciate not having to edit HTML codes in the Moodle editor.

However Iñaki has gone above and beyond simplifying the process one step further by integrating the {mlang} tag system into TinyMCE with his tinymce moodlelang2 plugin, also currently only available on GitHub. It is compatible with both multilangsecond and multilang2. Multilingual language tagging of content has now become as simple as selecting the content with your mouse and selecting the appropriate language from TinyMCE's dropdown menu. It also locks the tags so you can't accidental delete part of them and even highlights them so you can see them while editing the text.

Here is a video that was made by the author demonstrating a beta version of his plugins:

I am super exited to see innovations like this making Moodle simpler to use for course developers and administrators which results in a better experience for students.

If you are involved in creating multilingual Moodle sites, drop me a comment below. I would love to hear about your experiences.

Michael Milette