Macbook 12 For Web Development

With an all-new design that looks great on macOS Big Sur, Xcode 12 has customizable font sizes for the navigator, streamlined code completion, and new document tabs. Xcode 12 builds Universal apps by default to support Mac with Apple Silicon, often without changing a single line of code.

Which Macbook for web development? I am joining uni this fall, and I need a new computer. I currently used a chunky, slow 2010 macbook pro, and just doesnt do the job anymore. Every web designer needs a decent software program to succeed in their career and create a unique reputation for their design products. And sometimes, what’s working perfectly on PC, will not do the same for Mac users. Thankfully, today Mac fans don’t have any issues with that as there are tons of web design tools right at their fingertips.

The low end macbook 2016 processor is not that pitiful if you're just looking at hte low-end mac laptops. It's probably about 25% slower in terms of pure processing power than the low-end 13' 2016 Macbook Pro. It's only when you look at upgrading to an i7 processor (i.e. Spending $1800 minimum) that the Macbook looks really weak. Read on for our take on the MacBook, MacBook Air, MacBook Pro and iMac for web development. The prettiest and most portable range of Apple’s current Mac lineup is undoubtably the new MacBook. They come in a range of colors — silver, space grey, gold and rose gold, boast a slimmer unibody chassis than ever, and weigh a staggeringly.

Designed for macOS Big Sur.

Xcode 12 looks great on macOS Big Sur, with a navigator sidebar that goes to the top of the window and clear new toolbar buttons. The navigator defaults to a larger font that’s easier to read, while giving you multiple size choices. New document tabs make it easy to create a working set of files within your workspace.

Document tabs.

The new tab model lets you open a new tab with a double-click, or track the selected file as you click around the navigator. You can re-arrange the document tabs to create a working set of files for your current task, and configure how content is shown within each tab. The navigator tracks the open files within your tabs using strong selection.

Navigator font sizes.

The navigator now tracks the system setting for “Sidebar icon size” used in Finder and Mail. You can also choose a unique font size just for Xcode within Preferences, including the traditional dense information presentation, and up to large fonts and icon targets.

Code completion streamlined.

A new completion UI presents only the information you need, taking up less screen space as you type. And completions are presented much faster, so you can keep coding at maximum speed.

Redesigned organizer.

An all-new design groups all critical information about each of your apps together in one place. Choose any app from any of your teams, then quickly navigate to inspect crash logs, energy reports, and performance metrics, such as battery consumption and launch time of your apps when used by customers.

SwiftUI

SwiftUI offers new features, improved performance, and the power to do even more, all while maintaining a stable API that makes it easy to bring your existing SwiftUI code forward into Xcode 12. A brand new life cycle management API for apps built with SwiftUI lets you write your entire app in SwiftUI and share even more code across all Apple platforms. And a new widget platform built on SwiftUI lets you build widgets that work great on iPad, iPhone, and Mac. Your SwiftUI views can now be shared with other developers, and appear as first-class controls in the Xcode library. And your existing SwiftUI code continues to work, while providing faster performance, better diagnostics, and access to new controls.

Universal app ready.

Xcode 12 is built as a Universal app that runs 100% natively on Intel-based CPUs and Apple Silicon for great performance and a snappy interface.* It also includes a unified macOS SDK that includes all the frameworks, compilers, debuggers, and other tools you need to build apps that run natively on Apple Silicon and the Intel x86_64 CPU.

Updated automatically

When you open your project in Xcode 12, your app is automatically updated to produce release builds and archives as Universal apps. When you build your app, Xcode produces one binary “slice” for Apple Silicon and one for the Intel x86_64 CPU, then wraps them together as a single app bundle to share or submit to the Mac App Store. You can test this at any time by selecting “Any Mac” as the target in the toolbar.

Test multiple architectures.

On the new Mac with Apple Silicon, you can run and debug apps running on either the native architecture or on Intel virtualization by selecting “My Mac (Rosetta)” in the toolbar.

Multiplatform template

New multiplatform app templates set up new projects to easily share code among iOS, iPadOS, and macOS using SwiftUI and the new lifecycle APIs. The project structure encourages sharing code across all platforms, while creating special custom experiences for each platform where it makes sense for your app.

Macbook 12 For Web Development Websites

Improved auto-indentation

Swift code is auto-formatted as you type to make common Swift code patterns look much better, including special support for the “guard” command.

StoreKit testing

New tools in Xcode let you create StoreKit files that describe the various subscription and in-app purchase products your app can offer, and create test scenarios to make sure everything works great for your customers — all locally testable on your Mac.

Macbook 12 For Web Development

Get started.

Download Xcode 12 and use these resources to build apps for all Apple platforms.

My experience coding on the new MacBook when compared to the MacBook Pro

This past month I’ve been using the latest Apple MacBook for web development. Let’s start with a couple of questions: could this laptop be the only computer I use? Probably. Would I want that? Hell no!

Update: Soon after I wrote this, Apple upgraded the MacBook line. The new upgrade include a Skylake processor with integrated Intel HD 515 graphics supplying 25% faster graphics performance, and improved battery life. They also improved the 8GB RAM with faster 1866 MHz memory. And they even have a Rose Gold option now, if that’s what floats your boat!

How I Work

Everyone has their own workflow and habits, and everyone uses their computer for different tasks — my needs may not be the same as yours. To put this review in context, here’s the kind of work I do and tools I use:

  • I do minor graphic editing, mainly converting vector AI files to SVG and tweaking colors.

My main machine is a beefed-up 2012 Mac Mini sporting a 2.3GHz i7 processor, 16GB RAM and a 1TB SSD. I like to have as much information readily available as possible, so I use a dual monitor setup: one 27“ Apple Thunderbolt Display (important for the following review!) and one 24” Samsung monitor. To the left of my keyboard I have a Magic Trackpad, and on the right I have a Logitech Performance MX mouse with plenty of shortcuts mapped to the extra buttons. As a side note, I keep two panes open in Atom so I can review code side-by-side.

Here’s what my setup looks like:

This setup works great for me but, since I’m often on the move, I also have a laptop so I can work wherever I go. I’ve been using a 2015 13″ Retina MacBook Pro — until now.

Why the MacBook?

I’ve read countless reviews of the 12″ MacBook and played with it on visits to the Apple Store. I always thought it was a gorgeous machine but the lack of connectivity and processing power stopped me from getting one… until last month.

I was reading a discussion on some forum — I can’t remember which, but it was most likely reddit — where someone said something along the lines of the most useful laptop is the one you have with you, not the one sitting at home on a table. I read this on my iPhone while stuck in a bar for a couple of hours due to a roadblock, and I didn’t have my flashy new MacBook Pro with me. Two hours of precious coding time was lost forever; when I looked at my rMBP that morning, I thought: nah, I won’t need it today — it’s too bulky to carry around.

Macbook 12 For Web Development

The next day, I was on the Apple website, ready to give them a good chunk of my hard-earned monies.

The Unit

I chose the Space Grey (sounds so much better than black, doesn’t it?), mid-range version with the firm intention to carry it with me anytime I leave the house. 1.2 GHz Intel Core M, 8GB RAM and 512GB SSD. The video card is an Intel HD Graphics 5300. This MacBook costs $1,599.

The first thing that struck me was its weight. I have an iPad Air 2 with a folding case and I can barely notice the weight difference compared to the MacBook. When the MacBook is closed, it has the same thickness as the iPad Air 2 and its case. You can read plenty of reviews on the web about its build quality, weight, size, screen, and so on. I’m not going to focus on that stuff but I felt compelled to say that, for my intended usage, the light weight is really astonishing.

The Keyboard

I should add a few words regarding the keyboard: it’s awesome — for me, at least. I have small fingers and I absolutely hate noisy and hipster-y mechanical keyboards (get a fucking typewriter already!) with never-ending travel distance. My favorite keyboard remains the wired Apple Keyboard with Numeric Keypad, but the MacBook keyboard is a close second. If you are a fan of big, bulky keyboards or have large sausage fingers, you may not like it so much. Before committing to buy a MacBook, you should make sure you enjoy typing on it — test one out at an Apple Store. The keyboard is as silent as the rest of the machine, which is a big plus. A few years ago, I sat next to a guy who liked to show he was working hard by pounding on his keyboard as hard as he could. A year of that will make you totally nauseous every time you hear a noisy keyboard!

The Speed

My workflow consists of coding in Ruby and editing vector files in Affinity Designer. When working on this laptop, I haven’t noticed any difference in speed compared to my MacBook Pro. Atom opening, ActiveRecord parsing large PostgreSQL databases, switching between apps — it’s all just as fast and I’ve yet to see the infamous beach ball. Granted, compiling Ruby or native extensions on the MacBook takes several seconds longer than on the MacBook Pro, but I only do those tasks when first setting up my machine.

Keep in mind that I’m not playing games or editing 4K movies. I’m only coding and cropping the occasional vector file to export as an SVG. For tasks like these, RAM is much more important than processing power; with 8GB, there’s plenty of it to go around.

Macbook 12 For Web Development Software

I often work with an Ubuntu Server VM using Vagrant and VirtualBox to simulate my production environment before release. I had no issues there either.

The Battery

Before my MacBook Pro, I used a MacBook Air. The battery life of the Air completely crushed the MacBook Pro, so I wasn’t expecting much from the MacBook. But on average, it lasts about an hour longer than the Pro, which was a pleasant surprise — I get 8h out of it before it needs to be fed again. I have few tweaks to maximize the battery life, such as turning off OS X transparency effects and using the screen brightness at about 80%. I use iStat Menus to keep an eye on what my MacBook is doing and to see if a process could potentially drain the battery too quickly.

I recently took a 15-hour trip to Japan and I easily used the MacBook for half the flight. I fell asleep before my laptop, so that’s a good thing.

The Screen

It’s a Retina display — 226 pixels per inch on a 16:10 aspect ratio. Several resolutions are supported, and I use it at 1440×900 to maximize screen real estate. At this resolution, nothing feels too small and everything is comfortably readable. The max brightness is usually too bright — not “staring into an exploding sun” bright like the iPhone, but bright enough on max settings to bother my eyes in an average lit room — so I decrease it to about 80% (which also helps with the battery life).

There’s no noticeable difference in screen real estate compared to a 13″ MacBook Pro.

The Connectivity (or lack thereof)

The MacBook only has one USB Type-C connector on the left side and that’s it. You use this port to charge the MacBook and to communicate with external devices. Oh, and a headphone jack on the right side. Initially, this put me off. What about my backups? I use CarbonCopyCloner to clone my entire disk on an external drive every other day. What about my Apple Thunderbolt Display? And USB sticks and devices?

Before jumping on board the MacBook, I took a look at how often I really use external devices. I don’t remember connecting my MacBook Pro to an external display or ever plugging a mouse in. I’d be hard pressed to find a USB thumb-drive in under 10 minutes — if I even have any at all. And as for the backups, there are adaptors: I got this one from Kanex for $14.

If you have an Apple Thunderbolt Display and plan to connect the MacBook to it, you should know that it isn’t currently supported — you simply can’t do it. It doesn’t bother me because the goal of the MacBook is to use it outside of the house (or on the couch).

The Workflow

You can probably tell that I have a very specific workflow on my desktop. Adapting that workflow to a laptop has been challenging, but with a few tweaks I’m nearly as productive on my MacBook. The compromises I’ve made when working on the MacBook are the same ones I had to make on my MacBook Pro.

To work around the limited screen real estate, I make use of Spaces, which comes with OS X. I organize these spaces as such:

  • Desktop 1: browser
  • Desktop 2: Atom (I split the panes horizontally instead of vertically)
  • Desktop 3: 4 terminal windows
  • Desktop 4: SourceTree
  • Desktop 5: second browser
  • Desktop 6: Affinity Designer
  • Desktop 7: Mail and Slack

Since I always use the same apps on the same Space, I have keyboard shortcuts mapped to access them quickly. The major downside is that I can’t access all the information I want at a glance, like reading a web page while looking at my code. But this is the case on any laptop, not just the MacBook.

If I absolutely require two monitors while on the go, the excellent Duet Display app turns my iPad into an external screen. I’ve used it only once, mostly just to see how it works (quite good!), but I think it would easily meet my needs for a second screen.

Conclusion

My opinion is that, to be the most productive, I need a lot of screen real estate. This is a problem whether I use a MacBook Pro or the new MacBook. With that in mind, I didn’t find any cons to the MacBook when comparing it to the MacBook Pro. I did find a lot of pros, though: the light weight, the better battery life, the more comfortable keyboard, the silence from having no fan — these are just a few of the benefits that the MacBook has over the MacBook Pro.

If this is going to be your only dev machine, don’t get the MacBook — the Pro is a better choice if you can only get one machine. But if this is your second computer — one to carry with you everywhere you go — then I absolutely recommend the MacBook!

If you are interested in learning how to code and get certified by one of the world’s top universities, visit .

Macbook 12 For Web Development Tools

The 12″ MacBook: A Web Developer’s Perspective was originally published in Optional Bits on Medium, where people are continuing the conversation by highlighting and responding to this story.