<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Barry McGee</title>
    <description>The latest articles on DEV Community by Barry McGee (@barrymcgee).</description>
    <link>https://dev.to/barrymcgee</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F99891%2F80c23b52-2360-41ed-a7c8-27a25c69196d.jpg</url>
      <title>DEV Community: Barry McGee</title>
      <link>https://dev.to/barrymcgee</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/barrymcgee"/>
    <language>en</language>
    <item>
      <title>What I learned reviewing over 300 web developer resumes</title>
      <dc:creator>Barry McGee</dc:creator>
      <pubDate>Sat, 11 Jul 2020 21:07:43 +0000</pubDate>
      <link>https://dev.to/barrymcgee/what-i-learned-reviewing-over-300-web-developer-resumes-4p8g</link>
      <guid>https://dev.to/barrymcgee/what-i-learned-reviewing-over-300-web-developer-resumes-4p8g</guid>
      <description>&lt;p&gt;We're currently hiring a &lt;a href="https://canonical.com/careers/2215922"&gt;remote front-end web developer&lt;/a&gt; for my team at Canonical, and I have spent a lot of this week reviewing over 300 applications.&lt;/p&gt;

&lt;p&gt;As a result, I've moved 30 (~10%) of them to the next stage in our process, and I noted some reoccurring reasons why the other 90% were screened out at the first step of our hiring process.&lt;/p&gt;

&lt;p&gt;If you're currently in the market for a new role, take these considerations on board in your next application and try not to make these same mistakes.&lt;/p&gt;

&lt;h2&gt;
  
  
  🧐 Did not read the basic requirements of the job spec
&lt;/h2&gt;

&lt;p&gt;You must read the job spec, then re-read it again. Most job specs will have a "Must have" section and a "Nice to have" section. Requirements listed in the former are mandatory whereas those listed in the latter are optional. Failing to satisfy the first will result in you being immediately screened out by the hiring manager, if not the hiring software long before.&lt;/p&gt;

&lt;h2&gt;
  
  
  🌏 Did not have &lt;em&gt;Right to Work&lt;/em&gt;
&lt;/h2&gt;

&lt;p&gt;While many jobs are now listed as remote, for a myriad of unfortunate operational reasons, many companies will only accept candidates who do not need specific visas or sponsorship. Make sure you can legally work for a company under the circumstances stipulated before applying to join them.&lt;/p&gt;

&lt;h2&gt;
  
  
  📮 Did not provide a cover letter
&lt;/h2&gt;

&lt;p&gt;If a job application provides an upload field for a cover letter, you should provide one - even if the field is optional. Covering letters are your opportunity to introduce yourself and put your skills and experience in context.&lt;/p&gt;

&lt;h2&gt;
  
  
  💌 Did not provide a tailored cover letter
&lt;/h2&gt;

&lt;p&gt;Many of those who did provide a cover letter submitted a generic cover letter that they could send to any company. These paled in comparison to those who took the time to write a tailored letter referencing our company and more importantly, the role specifically.&lt;/p&gt;

&lt;h2&gt;
  
  
  🔤 Did not proofread their applications
&lt;/h2&gt;

&lt;p&gt;Your cover letter and resume should be free of spelling and grammar mistakes. Simple spelling and grammar mistakes suggest sloppiness and a lack of care. It's easy to miss your own mistakes, so get someone else to proofread your application or utilise the many software options available to do this for you. Proofreading is essential if the language in which you're applying is not your native language.&lt;/p&gt;

&lt;h2&gt;
  
  
  🚧 Included links to incomplete or broken projects
&lt;/h2&gt;

&lt;p&gt;If you're applying for a web developer role, any links to your work will be scrutinised. Do not link to your personal site if it has an "Under construction" banner or includes &lt;em&gt;Lorem Ipsum&lt;/em&gt; placeholder text. Do not link to projects you started, then abandoned without finishing. Consider any links you put on your resume to be "in production" and ask yourself - would the company you're applying to deploy this quality of work to production under their brand? If the answer is "No", revisit and iterate until the answer is "Yes".&lt;/p&gt;

&lt;h2&gt;
  
  
  😑 Submitted a resume that's hard to read or understand
&lt;/h2&gt;

&lt;p&gt;There seems to be a trend of using software to produce resumes that are keyword dense, so they are picked up by automated recruiting software. That's all well and good until it appears under the nose of an actual human. Remember that a hiring manager is likely reviewing a large number of resumes of which your carefully curated application is but one. First impressions count. Resumes should be kept to less than two pages as a general rule of thumb but not at the cost of readability. Your experience should be chronological with your most recent experience first. Only include your experience relevant to the role. Don't add your whole life story back to high school.&lt;/p&gt;

&lt;h2&gt;
  
  
  🥈 Forgot that their application is not considered in isolation
&lt;/h2&gt;

&lt;p&gt;Finally, it's important to note that it's likely that not just one violation of the above will result in your application being rejection but a combination of them.&lt;/p&gt;

&lt;p&gt;As a hiring manager scans your application, they are slowly forming an opinion of you based on the information you have provided but also by mentally comparing it to the other applications they have already viewed for the same role.&lt;/p&gt;

&lt;p&gt;You might think it's not a big deal if you send a generic cover letter. However, when your application is viewed right after a person who spent considerable tailoring their cover letter - your generic cover letter is, relatively, a bit dull.&lt;/p&gt;

&lt;p&gt;In short, &lt;strong&gt;take your time and take care&lt;/strong&gt; to craft each application. You've got this. 👊🏻&lt;/p&gt;

&lt;p&gt;.&lt;br&gt;
.&lt;br&gt;
.&lt;/p&gt;

&lt;p&gt;(Photo credit: Charles Deluvio - Unsplash)&lt;/p&gt;

</description>
      <category>webdev</category>
      <category>career</category>
      <category>jobs</category>
      <category>resume</category>
    </item>
    <item>
      <title>Get that Pull Request merged - today.</title>
      <dc:creator>Barry McGee</dc:creator>
      <pubDate>Fri, 03 May 2019 20:39:11 +0000</pubDate>
      <link>https://dev.to/barrymcgee/get-that-pull-request-merged-today-3ifp</link>
      <guid>https://dev.to/barrymcgee/get-that-pull-request-merged-today-3ifp</guid>
      <description>&lt;p&gt;You've done the hard yards, that new feature or bug fix now works just as you'd like - now all that is left is to submit your Pull Request, get it landed and everyone is in profit, right?&lt;/p&gt;

&lt;p&gt;Not so fast. &lt;/p&gt;

&lt;p&gt;It's two, three, four days later and you're &lt;em&gt;still&lt;/em&gt; battling to land that Pull Request (PR) as you deal with suggestions to refactor your code, Quality Assurance (QA) bugs and merge conflicts. 😭&lt;/p&gt;

&lt;p&gt;The feeling of accomplishment you had initially when proposing your change is now a feeling of resentment as you're forced to revisit your code again and again. 🤬&lt;/p&gt;

&lt;p&gt;So, how can we avoid this scenario and ensure that your Pull Requests are landed quicker and with less hassle? &lt;/p&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Limit the scope of your change
&lt;/h2&gt;

&lt;p&gt;You should always try to keep your pull requests as small as possible. Focus on fixing or adding one thing at a time. The more changes you include in a PR, the higher the risk that you introduce bugs.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Avoid drive-bys
&lt;/h2&gt;

&lt;p&gt;A drive-by is a change or refactor you make while browsing through the code and you notice something obvious that should be changed. It might be as simple as a missing &lt;code&gt;alt\&lt;/code&gt; tag on an image or updating the indentation of a code block. By all means, make these changes, but propose them separately.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Rebase before proposing your changes
&lt;/h2&gt;

&lt;p&gt;&lt;a href="https://git-scm.com/book/en/v2/Git-Branching-Rebasing"&gt;Rebasing your changes&lt;/a&gt; on top of the branch you're proposing your changes to will reduce the chance of merge conflicts and also mean you're proposing your changes against the codebase as it exists in that moment, not as it was when you created your feature branch.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Make sure you run the tests locally
&lt;/h2&gt;

&lt;p&gt;If the project has a test suite, which hopefully it has, be sure to run those tests locally before proposing your changes. This should help highlight errors or linting issues in your changes.&lt;/p&gt;
&lt;/li&gt;
&lt;li&gt;
&lt;h2&gt;
  
  
  Siphon off non-blocking issues
&lt;/h2&gt;

&lt;p&gt;Often when a person is reviewing your code, they will offer suggestions that are very valid but not strictly show-stoppers for the change you're proposing. These might be UI improvements, code abstractions or refactors to existing features. In my opinion, so long as your change does not exacerbate an existing issue, these recommendations should be syphoned off as separate issues to be prioritised accordingly.&lt;/p&gt;
&lt;/li&gt;
&lt;/ol&gt;

&lt;p&gt;Incorporating the above steps into my own work has really increased the cadence at which I get my PRs merged. Hopefully, it might help you too. 🔥&lt;/p&gt;

</description>
      <category>git</category>
      <category>productivity</category>
      <category>webdev</category>
      <category>workflow</category>
    </item>
    <item>
      <title>Visualising scroll position in your Gatsby site</title>
      <dc:creator>Barry McGee</dc:creator>
      <pubDate>Fri, 15 Mar 2019 22:15:32 +0000</pubDate>
      <link>https://dev.to/barrymcgee/visualising-scroll-position-in-your-gatsby-site-2ocm</link>
      <guid>https://dev.to/barrymcgee/visualising-scroll-position-in-your-gatsby-site-2ocm</guid>
      <description>&lt;p&gt;At the start of this year, I rebuilt my blog using &lt;a href="https://www.gatsbyjs.org/"&gt;Gatsby&lt;/a&gt;. &lt;/p&gt;

&lt;p&gt;One of the stand-out features which set Gatsby apart from the rest as a static site generator is the &lt;a href="https://www.gatsbyjs.org/plugins/"&gt;plugin eco-system&lt;/a&gt;. Why re-invent the wheel if someone else has already designed a perfectly good wheel?&lt;/p&gt;

&lt;p&gt;The beauty of web development is the ease in which we can easily peer over the shoulder of someone else, who may well be on the other side of the world, and quickly learn from them. &lt;/p&gt;

&lt;p&gt;Working within a well-designed plugin eco-system, we can not only learn from other developers but also turbo-charge our own development by quickly adopting their work and adding it to our own projects to make something that is hopefully more than the sum of its parts.&lt;/p&gt;

&lt;p&gt;I'm an impatient person by nature. Have you been stuck on a train or plane with no idea when you'll be moving again? Isn't it utterly infuriating? Others &lt;a href="https://www.theguardian.com/lifeandstyle/2017/aug/28/michelle-hanson-still-here-waiting-childcae"&gt;seem to agree&lt;/a&gt;.  &lt;/p&gt;

&lt;p&gt;Whenever there is any major transport disruption event, you'll notice that the first thing a frazzled interviewee on the evening news will complain about is typically not the cause of the disruption but the lack of information provided around it.  &lt;/p&gt;

&lt;p&gt;A little information goes a long, long way.&lt;/p&gt;

&lt;p&gt;You'll notice as you scroll down a post on &lt;a href="https://www.barrymcgee.co.uk"&gt;my blog&lt;/a&gt;, your progress is being tracked along the top of the screen from left to right. &lt;/p&gt;

&lt;p&gt;This gives you an immediate visual indicator of how long you have left on your journey to the end of this page. &lt;/p&gt;

&lt;p&gt;In our time-starved digital world, it's my theory that this little indicator makes it more likely you'll continue reading all the way to the bottom (the quality of my writing notwithstanding.)&lt;/p&gt;

&lt;p&gt;I developed this little feature on my blog and saw that it was good. I then bundled it up as a &lt;a href="https://www.gatsbyjs.org/packages/gatsby-plugin-scroll-indicator/"&gt;Gatsby plugin&lt;/a&gt; for others to pick up and use in their own Gatsby sites. &lt;/p&gt;

&lt;p&gt;To add it to your own Gatsby site, install using npm;&lt;/p&gt;

&lt;p&gt;&lt;code&gt;npm install --save gatsby-plugin-scroll-indicator&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;...or Yarn...&lt;/p&gt;

&lt;p&gt;&lt;code&gt;yarn add gatsby-plugin-scroll-indicator&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;...and then add the plugin reference and config options to your &lt;code&gt;gatsby-config.js&lt;/code&gt; file:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight"&gt;&lt;pre class="highlight plaintext"&gt;&lt;code&gt;plugins: [
  {
    resolve: `gatsby-plugin-scroll-indicator`,
    options: {
      // Configure your indicator bar color here
      color: '#BADA55',
    },
  },
];
&lt;/code&gt;&lt;/pre&gt;&lt;/div&gt;



&lt;p&gt;Restart all the things, clear all the caches and you should now have a visual scroll indicator on your site too. 💥&lt;/p&gt;

&lt;p&gt;Source code: &lt;a href="https://github.com/barrymcgee/gatsby-plugin-scroll-indicator"&gt;Github&lt;/a&gt;&lt;/p&gt;

</description>
      <category>gatsby</category>
      <category>blog</category>
      <category>plugin</category>
      <category>scroll</category>
    </item>
    <item>
      <title>Making remote work, work.</title>
      <dc:creator>Barry McGee</dc:creator>
      <pubDate>Mon, 18 Feb 2019 16:35:42 +0000</pubDate>
      <link>https://dev.to/barrymcgee/making-remote-work-work-3kob</link>
      <guid>https://dev.to/barrymcgee/making-remote-work-work-3kob</guid>
      <description>&lt;p&gt;I have been working remotely from home full-time for the past two years, and I love it. &lt;/p&gt;

&lt;p&gt;Previous to this, I had always worked in an office environment, and now I wonder if I could ever go back to working an office full-time again. &lt;/p&gt;

&lt;p&gt;I simply love the freedom working from home brings - be that the freedom from a daily commute sitting in traffic or the freedom to roam around my favourite coffee haunts with just my laptop on my back and my phone in my pocket (for tethering if WiFi is patchy).&lt;/p&gt;

&lt;p&gt;Friends and family will often say to me when this topic comes up; "Oh, I could never do that, I'd get distracted too easily." The alternate view sometimes offered is; "I could never do that, I'd still be answering emails at 12 o'clock at night." &lt;/p&gt;

&lt;p&gt;People seem to worry that they'd never be able to start working or they'd conversely never be able to stop working. Others would love to work remotely but feel they don't have the culture within their work environment to support it.&lt;/p&gt;

&lt;p&gt;Everyone is, of course, different and your mileage may vary but here are some tips I've found help me.&lt;/p&gt;

&lt;h2&gt;
  
  
  Establish and nurture trust
&lt;/h2&gt;

&lt;p&gt;When working remotely, trust is crucial. &lt;/p&gt;

&lt;p&gt;That is to say, your customers, clients or manager must trust that you'll consistently fulfil or exceed any expectations placed upon you. &lt;/p&gt;

&lt;p&gt;Problems will inevitably arise if you start to fall short without a good explanation as those who have placed their trust in you will start to wonder how you're filling your day.&lt;/p&gt;

&lt;h2&gt;
  
  
  Create your ideal workspace
&lt;/h2&gt;

&lt;p&gt;A considerable advantage remote workers have over our office-dwelling colleagues is the ability to control our work environment. &lt;/p&gt;

&lt;p&gt;I have a home office which I've gradually crafted to suit my needs perfectly. &lt;/p&gt;

&lt;p&gt;Picking out my ideal desk, chair, screen and wall-art makes sitting down to work every morning a pleasure. &lt;/p&gt;

&lt;p&gt;Having a separate room in the house for this also helps me create a divide between work-life and life-life.&lt;/p&gt;

&lt;h2&gt;
  
  
  Eliminate distractions
&lt;/h2&gt;

&lt;p&gt;Distractions are everywhere. Nearly all of us carry a shiny, beeping, vibrating unrelenting distraction device on our person everywhere we go. &lt;/p&gt;

&lt;p&gt;You need to eliminate distractions both in your physical environment but also in your virtual environment. &lt;/p&gt;

&lt;p&gt;In the physical environment, if, for example, you have other family members at home while you work, you may need to agree with them not to disturb you when your office door is closed. &lt;/p&gt;

&lt;p&gt;Virtually, certain tools and techniques to help this. Some steps I have taken include;&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;Disabling the red notification indicator on all chat icons &lt;/li&gt;
&lt;li&gt;I've installed a Gmail app called &lt;a href="https://adios.ai/"&gt;Adios&lt;/a&gt; which will hold back my emails and only deliver them in batches, three times a day - 9am, 1pm and 5pm.&lt;/li&gt;
&lt;li&gt;Turning the sound and vibration on my phone off and placing it face down on the desk.&lt;/li&gt;
&lt;li&gt;Disabling the majority of my iPhone apps from pushing notifications.&lt;/li&gt;
&lt;li&gt;Muting all Whatsapp groups for 1 year&lt;/li&gt;
&lt;li&gt;I use a &lt;a href="https://heyfocus.com/"&gt;website blocker&lt;/a&gt; on a schedule. A myriad of distracting websites are blocked between 9am-1pm and 2pm-6pm.&lt;/li&gt;
&lt;/ul&gt;

&lt;h2&gt;
  
  
  Create a routine
&lt;/h2&gt;

&lt;p&gt;One of the temptations of remote working is to upend the traditional nine-to-five and work unconventional hours. You can do this if it suits your team, but I find it's essential to maintain a routine. &lt;/p&gt;

&lt;p&gt;A routine creates structure and consistency, both of which are conducive to productivity. &lt;/p&gt;

&lt;p&gt;This will not only give you a strong indicator of when to start working and also a strong indicator of when to stop.&lt;/p&gt;

&lt;h2&gt;
  
  
  Exercise
&lt;/h2&gt;

&lt;p&gt;One of the more dismaying aspects of working from home is the realisation of how little you move in the course of the day when your desk is mere metres from your bed. &lt;/p&gt;

&lt;p&gt;When I was previously commuting to the office while living in London, I was regularly clocking up about 12,000 steps a day. &lt;/p&gt;

&lt;p&gt;However, once I moved back to Belfast and started working from home, that plummeted to about 3000 steps a day. It's therefore very important to inject some regular exercise into your day. &lt;/p&gt;

&lt;p&gt;One thing I've found that has really helped to regularly get me out and about, and which was only really possible because I now work from home, is acquiring a canine companion - in my case, Murphy, an energetic cocker spaniel.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--ryT_BvXI--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.barrymcgee.co.uk/static/51d80d6a2dbf7e450768d72e92c49879/a61d1/screenshot-2019-01-19-at-14.04.54.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--ryT_BvXI--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.barrymcgee.co.uk/static/51d80d6a2dbf7e450768d72e92c49879/a61d1/screenshot-2019-01-19-at-14.04.54.png" alt="Murphy, magnificent on a round bale" title="Murphy, magnificent on a round bale"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;No matter how deep you are in a tunnel of code, a young pup will let you know he has needs too and a brisk walk in fresh air is infinitely preferable to mopping up a mess on the kitchen floor. 😫&lt;/p&gt;

&lt;h2&gt;
  
  
  Communication
&lt;/h2&gt;

&lt;p&gt;When you're not visible in an office every day you need to find other ways to make yourself visible. you may even need to over-compensate a little bit. This may be daily status reports, piping up a bit more in team chat channels or taking on tasks not strictly in your remit but help remind others of your value to the team. Helping to clear a backlog of Pull Requests is a good example of this. You should also be mindful that if you're deep in the trenches of the particular task and but making any visible progress to your wider team, you should flag that up. You know you're working hard and making incremental progress but no-one else does unless you tell them.&lt;/p&gt;

&lt;h2&gt;
  
  
  In conclusion
&lt;/h2&gt;

&lt;p&gt;Trust, discipline and communication are key to making remote work, work in my opinion. But, once you get it right, it's magic. 👌🏻&lt;/p&gt;

</description>
      <category>remote</category>
      <category>productivity</category>
      <category>wfh</category>
      <category>webdev</category>
    </item>
    <item>
      <title>Formatting your code with Prettier</title>
      <dc:creator>Barry McGee</dc:creator>
      <pubDate>Mon, 18 Feb 2019 14:17:58 +0000</pubDate>
      <link>https://dev.to/barrymcgee/formatting-your-code-with-prettier-4b16</link>
      <guid>https://dev.to/barrymcgee/formatting-your-code-with-prettier-4b16</guid>
      <description>

&lt;p&gt;For many years, I've spent a considerable amount of time squinting at my code editor and trying to decide if the curly brackets at the top of my screen align with the curly brackets at the bottom of my screen.&lt;/p&gt;

&lt;p&gt;The reason for this is to make sure my code is tidy and consistent and thus easier to maintain - either by myself at a later date or by someone else.&lt;/p&gt;

&lt;p&gt;I'm also tidy by nature - clutter stresses me out. I like a tidy desk, a tidy house, a tidy car and a tidy garden. There is a place for everything and everything should be in its place. If it doesn't &lt;a href="https://www.youtube.com/watch?v=WvyeapVBLWY"&gt;give me joy&lt;/a&gt; - it goes in the bin!&lt;/p&gt;

&lt;h2&gt;
  
  
  Lint all the things
&lt;/h2&gt;

&lt;p&gt;As front-end development matured rapidly in the early part of this decade, linters became more and more popular. We had &lt;a href="https://jshint.com/"&gt;JShint&lt;/a&gt; which evolved into &lt;a href="https://eslint.org/"&gt;Eslint&lt;/a&gt; for Javascript and &lt;a href="https://github.com/brigade/scss-lint"&gt;Scsslint&lt;/a&gt;, latterly superseded by &lt;a href="https://github.com/sasstools/sass-lint"&gt;Sasslint&lt;/a&gt;, for Sass files.&lt;/p&gt;

&lt;p&gt;HTML linters also came and went but the community never seemed to coalesce around one solution. This may be partly because HTML is rarely written in isolated &lt;code&gt;.html&lt;/code&gt; files these days - it is typically moulded around template tags of various flavours to enable dynamic population of content.&lt;/p&gt;

&lt;p&gt;So, this was great - up to a point. As these linters tried to be all things to all men, they shipped with a seemingly infinite array of config options. The advantage of this was you could persuade your linter to check your code to ensure it's was exactly as you'd check it yourself. This disadvantage of having a wide array of config options is each project could be set up very differently, even within small teams. This invariably meant that, despite best efforts, you would break your build when submitting a Pull Request by tripping the linter. Cue a git log littered with "&lt;em&gt;Fix the linter&lt;/em&gt;" commit messages.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--Tcui2nEe--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.barrymcgee.co.uk/static/93e72abbec90d0e9da21d93ae0919737/49787/screenshot-2019-02-17-at-17.23.52.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--Tcui2nEe--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.barrymcgee.co.uk/static/93e72abbec90d0e9da21d93ae0919737/49787/screenshot-2019-02-17-at-17.23.52.png" alt="Fixing the linter 🤦🏻‍♂️" title="Fixing the linter 🤦🏻‍♂️"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Many of these linters also mixed stylistic issues with code validity issues. Eslint, for example, can be configured to flag up incorrect indentation (stylistic issue) and also flag up duplicate &lt;code&gt;const&lt;/code&gt; declarations (validity issue).&lt;/p&gt;

&lt;p&gt;As a result, running Eslint over a codebase with the &lt;code&gt;--fix&lt;/code&gt; option will not only format your code but possibly &lt;em&gt;rewrite&lt;/em&gt; it. While this an excellent test of your confidence in your test suite, this is also an exercise of exponential risk.&lt;/p&gt;

&lt;h2&gt;
  
  
  A prettier alternative
&lt;/h2&gt;

&lt;p&gt;Enter &lt;a href="https://prettier.io/"&gt;Prettier&lt;/a&gt;. By their own definition, Prettier is "an opinionated code formatter" with support for a wide range of languages including HTML, CSS, JS, JSX, Yaml and even HTML. Unlike Eslint, it is unconcerned with the validity of code, only the formatting. It integrates with most editors and can be triggered on file save which to me, is like a little magic fairy jumping in and cleaning up my code!&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--5ayo-A4k--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://www.barrymcgee.co.uk/static/prettier-4561d423322fd81fc63ff9ee9091b868.gif" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--5ayo-A4k--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_66%2Cw_880/https://www.barrymcgee.co.uk/static/prettier-4561d423322fd81fc63ff9ee9091b868.gif" alt="Using Prettier on save" title="Using Prettier on save - magic!"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Prettier can work in &lt;a href="https://prettier.io/docs/en/eslint.html"&gt;conjunction with Eslint&lt;/a&gt;, it has the ability to &lt;a href="https://prettier.io/docs/en/ignore.html"&gt;ignore&lt;/a&gt; code blocks or entire files you want to preserve and can be set up to run as a &lt;a href="https://prettier.io/docs/en/precommit.html"&gt;pre-commit hook&lt;/a&gt; or &lt;a href="https://prettier.io/docs/en/cli.html"&gt;build step&lt;/a&gt;.&lt;/p&gt;

&lt;p&gt;Despite being a relative newcomer, Prettier has already been adopted by a wide range of popular code repositories and can already count Facebook, Paypal and Webpack among it's consumers. Prettier was built by core contributors to React and React Native so unsurprisingly, it's highly recommended by those teams also.&lt;/p&gt;

&lt;p&gt;Central to Prettier's mission statement is the relatively few config options it offers. Prettier is heavily opinionated for a reason - you and your team should stop debating relatively trivial aspects of code formatting and concentrate on shipping value to your users.&lt;/p&gt;

&lt;p&gt;That said, they have offered &lt;a href="https://prettier.io/docs/en/options.html"&gt;a few options&lt;/a&gt; such as tabs width to prevent landing on either side of very polarising formatting choices becoming a show stopper to adoption by strongly opinionated teams.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://res.cloudinary.com/practicaldev/image/fetch/s--FpwYLAJz--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.barrymcgee.co.uk/static/dca6aaf470ae454ab6cbc4b4c168b97d/66a7d/screenshot-2019-02-17-at-17.21.09.png" class="article-body-image-wrapper"&gt;&lt;img src="https://res.cloudinary.com/practicaldev/image/fetch/s--FpwYLAJz--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_880/https://www.barrymcgee.co.uk/static/dca6aaf470ae454ab6cbc4b4c168b97d/66a7d/screenshot-2019-02-17-at-17.21.09.png" alt="Banish formatting lint errors forever" title="Banish formatting lint errors forever"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Adopting Prettier will introduce consistency across your codebases making it easier to onboard new developers, remove formatting lint errors from your life and ensure you never have to debate trivial code formatting opinions - what's not to like?&lt;/p&gt;

&lt;h2&gt;
  
  
  Dealing with rejection
&lt;/h2&gt;

&lt;p&gt;Ok, so there are some things people won't like. After being convinced of the magic of Prettier, I pushed hard to have it adopted by our development teams at Canonical and quite a few developers were initially sceptical as for some, Prettier can be a little &lt;em&gt;too&lt;/em&gt; opinionated.&lt;/p&gt;

&lt;p&gt;The one solid piece of advice I'll impart for advocating Prettier is to run Prettier over your codebase and push it up as a &lt;a href="https://github.blog/2019-02-14-introducing-draft-pull-requests/"&gt;draft pull request&lt;/a&gt;. This will ensure your fellow team members are discussing the actual impact on your codebase over the theoretical impact on your codebase, which can be wildly different.&lt;/p&gt;

&lt;p&gt;After making my initial case, a lot of feedback I received from fellow developers pointed to a particular block of code and expressed an opinion on how running Prettier over it made it &lt;em&gt;uglier&lt;/em&gt;, not prettier.&lt;/p&gt;

&lt;p&gt;In some cases, I couldn't disagree but in other cases, I personally preferred the code after Prettier had formatted it. And therein lies the rub - beauty is in the eye of the beholder.&lt;/p&gt;

&lt;p&gt;The prettiness of code is entirely subjective which is why formatting debates can be so divisive to start with. The power of Prettier is not that it can make all code pretty to all people - it's that it removes the opportunity to debate such subjective opinions and allows you and your team to channel your energy into more important matters.&lt;/p&gt;

&lt;p&gt;You can also forget about squinting at curly braces morning, noon and night. ✨&lt;/p&gt;


</description>
      <category>development</category>
      <category>formatting</category>
      <category>frontend</category>
      <category>webdev</category>
    </item>
  </channel>
</rss>
