PageSourceSearch

https://paulrcook.com/_next/static/chunks/pages/blog/gatsby-tailwind-emotion-0127dd939ca491bd.js

js paulrcook.com collected 2026-09-25 21:25:20 UTC 22,495 bytes, 1 lines download raw bytes

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[902],{1598:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/blog/gatsby-tailwind-emotion",function(){return n(9953)}])},250:function(e,t,n){"use strict";var o=n(5893),i=n(5988),a=n.n(i),s=(new Date).getFullYear();t.Z={unstable_staticImage:!0,footer:(0,o.jsxs)("footer",{className:"jsx-a28e83f8adbece9d",children:[(0,o.jsxs)("small",{className:"jsx-a28e83f8adbece9d",children:[(0,o.jsx)("time",{className:"jsx-a28e83f8adbece9d",children:s})," \xa9 Paul Cook.",(0,o.jsx)("a",{href:"/feed.xml",className:"jsx-a28e83f8adbece9d",children:"RSS"})]}),(0,o.jsx)(a(),{id:"a28e83f8adbece9d",children:"footer.jsx-a28e83f8adbece9d{margin-top:8rem}a.jsx-a28e83f8adbece9d{float:right}"})]})}},9953:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return g}});var o=n(5893),i=n(8941),a=n.n(i),s=n(3805),r=n(250),l=n(3905);function d(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function c(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{},o=Object.keys(n);"function"===typeof Object.getOwnPropertySymbols&&(o=o.concat(Object.getOwnPropertySymbols(n).filter((function(e){return Object.getOwnPropertyDescriptor(n,e).enumerable})))),o.forEach((function(t){d(e,t,n[t])}))}return e}function h(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},t=function(){var t=Object.assign({p:"p",img:"img",h2:"h2",a:"a",h3:"h3",ul:"ul",li:"li",ol:"ol",code:"code",pre:"pre",strong:"strong",h1:"h1"},(0,l.useMDXComponents)(),e.components);return(0,o.jsxs)(o.Fragment,{children:[(0,o.jsx)(t.p,{children:(0,o.jsx)(t.img,{src:"/images/wind.jpg",alt:"Trees being blown in the wind"})}),"\n",(0,o.jsx)(t.h2,{children:"Introduction"}),"\n",(0,o.jsx)(t.p,{children:"In the spirit of continuous dissatisfaction with my current site, I've decided to add Tailwind into the mix."}),"\n",(0,o.jsx)(t.p,{children:"Right now my site uses Emotion to do some very barebones styling, but I've been wanting to play around with Tailwind for quite a while, because, why not?"}),"\n",(0,o.jsx)(t.p,{children:"Before I do that (and because I ran into problems doing it with my current setup) I decided to do a dry run with CodeSandbox."}),"\n",(0,o.jsx)(t.p,{children:"We'll use CodeSandbox and the Gatsby starter default to accomplish it."}),"\n",(0,o.jsxs)(t.p,{children:["If you want to skip the rest of this and just see the results, you can find that here: ",(0,o.jsx)(t.a,{href:"https://codesandbox.io/s/gatsby-starter-with-tailwind-and-emotion-nb2w7",children:"https://codesandbox.io/s/gatsby-starter-with-tailwind-and-emotion-nb2w7"})]}),"\n",(0,o.jsx)(t.h3,{children:"Don't know what Emotion and Tailwind are?"}),"\n",(0,o.jsx)(t.p,{children:"You're not alone!"}),"\n",(0,o.jsx)(t.p,{children:"The short of it is that Emotion helps you write your CSS in your JS and Tailwind is a CSS framework for writing your styles with utility classes."}),"\n",(0,o.jsx)(t.p,{children:"If that doesn't answer your questions check out their docs:"}),"\n",(0,o.jsxs)(t.ul,{children:["\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://emotion.sh/docs/introduction",children:"https://emotion.sh/docs/introduction"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://tailwindcss.com",children:"https://tailwindcss.com"})}),"\n"]}),"\n",(0,o.jsx)(t.h3,{children:"What this post isn't"}),"\n",(0,o.jsx)(t.p,{children:"An introduction to any of these technologies. I'll post some resources at the end if you want to dig into them further, but this is just intended to explain how I scratched my itch figuring out how to Emotion and Tailwind together in Gatsby."}),"\n",(0,o.jsx)(t.p,{children:"Something I intend to apply to my website very soon."}),"\n",(0,o.jsx)(t.h2,{children:"Let's install stuff!"}),"\n",(0,o.jsx)(t.p,{children:"Everyone's favorite part of the tutorials is talking about what you need to install, right? Great!"}),"\n",(0,o.jsx)(t.p,{children:"I want to be able to do 2 things:"}),"\n",(0,o.jsxs)(t.ol,{children:["\n",(0,o.jsx)(t.li,{children:"Be able to use Tailwind in my CSS-in-JS styling."}),"\n",(0,o.jsxs)(t.li,{children:["Be able to use Tailwind classes as you would normally within ",(0,o.jsx)(t.code,{children:"className"}),"."]}),"\n"]}),"\n",(0,o.jsx)(t.h3,{children:"Step 1: Install Tailwind"}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.code,{children:"npm install tailwindcss --save-dev"})}),"\n",(0,o.jsx)(t.h3,{children:"Step 2: Install the PostCSS plugin for Gatsby"}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.code,{children:"npm install --save gatsby-plugin-postcss"})}),"\n",(0,o.jsxs)(t.p,{children:["Additionally, we'll need to add a PostCSS config in the root folder called ",(0,o.jsx)(t.code,{children:"postcss.config.js"}),". Add this:"]}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:'module.exports = () => ({\n  plugins: [require("tailwindcss")],\n})\n'})}),"\n",(0,o.jsx)(t.h3,{children:"Step 3: Install the Babel Tailwind macro"}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.code,{children:"npm install --save tailwind.macro@next"})}),"\n",(0,o.jsx)(t.h3,{children:"Step 4: Install the necessary libraries for Emotion"}),"\n",(0,o.jsx)(t.p,{children:"This is because I want to use Emotion! Thankfully, it's my site so I don't have to justify my decisions to 3rd parties."}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.code,{children:"npm install --save gatsby-plugin-emotion @emotion/core @emotion/styled"})}),"\n",(0,o.jsxs)(t.p,{children:["Then add the plugin to your ",(0,o.jsx)(t.code,{children:"gatsby-config.js"})]}),"\n",(0,o.jsx)(t.h3,{children:"Step 5: Install Purgecss"}),"\n",(0,o.jsx)(t.p,{children:"To remove those unwanted styles we aren't using we'll want to add Purgecss."}),"\n",(0,o.jsx)(t.p,{children:"Thankfully, Gatsby has a plugin to help us out:"}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.code,{children:"npm i gatsby-plugin-purgecss"})}),"\n",(0,o.jsx)(t.h3,{children:"Confirming we're all on the same page"}),"\n",(0,o.jsxs)(t.p,{children:["After installing everything you should be sure to have the plugins in your ",(0,o.jsx)(t.code,{children:"gatsby-config.js"}),"."]}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.strong,{children:"Do note"}),": the Purgecss plugin goes LAST."]}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:"plugins: [\n\t`gatsby-plugin-postcss`,\n\t`gatsby-plugin-emotion`,\n    // ...other plugins,\n    {\n      resolve: `gatsby-plugin-purgecss`,\n      options: {\n        printRejected: true,\n        tailwind: true,\n      },\n    },  \n],\n"})}),"\n",(0,o.jsx)(t.h2,{children:"Styling and profiling"}),"\n",(0,o.jsxs)(t.p,{children:["I'm going to do all of the example styling in the ",(0,o.jsx)(t.code,{children:"index.js"})," of the ",(0,o.jsx)(t.code,{children:"gatsby-starter-default"}),"."]}),"\n",(0,o.jsx)(t.h3,{children:"Using Tailwind Macro"}),"\n",(0,o.jsx)(t.p,{children:"I'm not well versed in Babel macro's, but I thought this was pretty sweet."}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:'import tw from "tailwind.macro"\nconst Text = tw.p`\n  text-xl text-gray-700 font-sans \n`\n\nconst IndexPage = () => (\n  <Layout>\n    <SEO title="Home" />\n    <h1>Hi people</h1>\n    <Text>Welcome to your new Gatsby site.</Text>\n    <Text>Now go build something great.</Text>\n    <div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>\n      <Image />\n    </div>\n    <Link to="/page-2/">Go to page 2</Link>\n  </Layout>\n)\n'})}),"\n",(0,o.jsx)(t.p,{children:"What Babel does is transform the tagged templates into a style object."}),"\n",(0,o.jsxs)(t.p,{children:[(0,o.jsx)(t.a,{href:"https://github.com/bradlc/babel-plugin-tailwind-components#how-it-works",children:"This is from the docs"}),":"]}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.strong,{children:"In"})}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:"const foo = tw`text-red hover:text-green sm:text-blue` \n"})}),"\n",(0,o.jsx)(t.p,{children:(0,o.jsx)(t.strong,{children:"Out"})}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:"const foo = {\n  color: '#e3342f',\n  ':hover': {\n    color: '#38c172'\n  }
1,\n  '@media (min-width: 576px)': {\n    color: '#3490dc'\n  }\n}\n"})}),"\n",(0,o.jsx)(t.h3,{children:"Mixing up Tailwind and Emotion"}),"\n",(0,o.jsx)(t.p,{children:"If you happen to be incrementally adding Tailwind onto a site that already has some styled components you can do that too."}),"\n",(0,o.jsx)(t.p,{children:"All you need to do is wrap"}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:'import styled from "@emotion/styled"\n\nconst Header = styled.h1`\n  color: red;\n  ${tw`\n    text-xl font-mono\n  `}\n`\n\nconst IndexPage = () => (\n  <Layout>\n    <SEO title="Home" />\n    <Header>Hi people</Header>\n    <Text>Welcome to your new Gatsby site.</Text>\n    <Text>Now go build something great.</Text>\n    <div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>\n      <Image />\n    </div>\n    <Link to="/page-2/">Go to page 2</Link>\n  </Layout>\n)\n'})}),"\n",(0,o.jsx)(t.h3,{children:"Using Utility classes"}),"\n",(0,o.jsxs)(t.p,{children:["And then last but not least can always use Tailwind's utility class directly in ",(0,o.jsx)(t.code,{children:"className"}),"."]}),"\n",(0,o.jsx)(t.pre,{children:(0,o.jsx)(t.code,{children:'const IndexPage = () => (\n  <Layout>\n    <SEO title="Home" />\n    <Header className="bg-black">Hi people</Header>\n    <Text>Welcome to your new Gatsby site.</Text>\n    <Text>Now go build something great.</Text>\n    <div style={{ maxWidth: `300px`, marginBottom: `1.45rem` }}>\n      <Image />\n    </div>\n    <Link\n      className="block mt-1 text-lg leading-tight font-semibold text-gray-900 hover:underline"\n      to="/page-2/"\n    >\n      Go to page 2\n    </Link>\n  </Layout>\n)\n'})}),"\n",(0,o.jsx)(t.h1,{children:"Conclusion"}),"\n",(0,o.jsx)(t.p,{children:"That's all I needed to get up and running."}),"\n",(0,o.jsx)(t.p,{children:"Let me know if you run into any problems. Feel free to message me on Twitter or ask questions in the comments and I'll try to help you out."}),"\n",(0,o.jsx)(t.p,{children:"If this was helpful you be sure to heart it and retweet."}),"\n",(0,o.jsx)(t.p,{children:"Thanks!"}),"\n",(0,o.jsx)(t.h3,{children:"Additional links for your own research"}),"\n",(0,o.jsxs)(t.ul,{children:["\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://tailwindcss.com/",children:"Tailwind's docs"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://postcss.org/",children:"PostCSS"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://emotion.sh/docs/introduction",children:"Emotion"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://www.gatsbyjs.org/docs/tailwind-css/",children:"Gatsby docs on styling with Tailwind"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://github.com/bradlc/babel-plugin-tailwind-components",children:"GitHub for the Babel plugin"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://nystudio107.com/blog/using-tailwind-css-with-gatsby-react-emotion-styled-components",children:"A blog post covering this exact content if you need a second article"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://adamwathan.me/css-utility-classes-and-separation-of-concerns/",children:"Adam Wathan's defense of utility classes"})}),"\n",(0,o.jsx)(t.li,{children:(0,o.jsx)(t.a,{href:"https://www.gatsbyjs.org/packages/gatsby-plugin-purgecss/",children:"Purgecss plugin"})}),"\n"]})]})},n=Object.assign({},(0,l.useMDXComponents)(),e.components),i=n.wrapper;return i?(0,o.jsx)(i,c({},e,{children:(0,o.jsx)(t,{})})):t()}var u=(0,o.jsx)(h,{});function g(e){return(0,s.withSSG)(a()({filename:"index.mdx",route:"/blog/gatsby-tailwind-emotion",meta:{title:"Styling Gatsby with Tailwind and Emotion Styled Components",author:"Paul Cook",type:"post",date:"2020-02-27T12:27:09.000Z",path:"gatsby-tailwind-emotion",categories:"Gatsby, Tailwind, Emotion Styled Components",featuredImage:"./wind.jpg",description:"Mixing things up"},pageMap:[{name:"blog",children:[{name:"angular-launch-darkly",route:"/blog/angular-launch-darkly",frontMatter:{title:"Using LaunchDarkly with Angular and RxJS",date:"2022/4/22",description:"Creating an Angular native LaunchDarkly service with RxJS",tag:"RxJS, Angular, LaunchDarkly",author:"Paul Cook"}},{name:"building-context",children:[{name:"index",route:"/blog/building-context",frontMatter:{title:"The Known and Unknown Unknowns of Web Development",author:"Paul Cook",type:"post",date:"2017-09-07T01:42:12.000Z",path:"building-context",categories:["Career","Learning"],tags:"Breaking Into Tech, Code Newbies",featuredImage:"./donald-rumsfeld-1.jpg",description:"The secret to learning is building up context."}}],route:"/blog/building-context"},{name:"easier-said-than-done",children:[{name:"index",route:"/blog/easier-said-than-done",frontMatter:{title:"Easier said than done",author:"Paul Cook",type:"post",date:"2019-03-17T18:46:09.000Z",path:"easier-said-than-done",timeline_notification:[1552848376],categories:["Life"],tags:"change, Learning",featuredImage:"./change.jpg",description:'The Apostle Paul said, "For I do n
1ot do what I want, but I do the very thing I hate."'}}],route:"/blog/easier-said-than-done"},{name:"fewer-better-books",children:[{name:"index",route:"/blog/fewer-better-books",frontMatter:{title:"Fewer, better books",author:"Paul Cook",type:"post",date:"2019-03-05T11:58:18.000Z",path:"fewer-better-books",timeline_notification:[1551787104],categories:["Life"],tags:"Books",featuredImage:"./bookshelf.jpg",description:"Sometimes quantity has a quality all its own. Just not with books. Aim to read the 100 best books you can over and over again."}}],route:"/blog/fewer-better-books"},{name:"fun-with-react-and-the-wordpress-rest-api",children:[{name:"index",route:"/blog/fun-with-react-and-the-wordpress-rest-api",frontMatter:{title:"Fun with React and the WordPress REST API",author:"Paul Cook",type:"post",date:"2017-07-22T19:50:13.000Z",path:"fun-with-react-and-the-wordpress-rest-api",categories:["Projects"],tags:"React, Wordpress REST API",featuredImage:"./screen-shot-2017-07-22-at-3-44-24-pm.png",description:"Experiments in React."}}],route:"/blog/fun-with-react-and-the-wordpress-rest-api"},{name:"gatsby-and-typescript",children:[{name:"index",route:"/blog/gatsby-and-typescript",frontMatter:{title:"The Great Gatsby: Using TypeScript",author:"Paul Cook",type:"post",date:"2019-05-17T11:27:09.000Z",path:"gatsby-and-typescript",timeline_notification:[1554377232],tags:"Gatsby",featuredImage:"./ts.png",description:"I used to hate TypeScript. Then I realized how wrong I was. Let's use it with Gatsby."}}],route:"/blog/gatsby-and-typescript"},{name:"gatsby-tailwind-emotion",children:[{name:"index",route:"/blog/gatsby-tailwind-emotion",frontMatter:{title:"Styling Gatsby with Tailwind and Emotion Styled Components",author:"Paul Cook",type:"post",date:"2020-02-27T12:27:09.000Z",path:"gatsby-tailwind-emotion",categories:"Gatsby, Tailwind, Emotion Styled Components",featuredImage:"./wind.jpg",description:"Mixing things up"}}],route:"/blog/gatsby-tailwind-emotion"},{name:"goodbye-wordpress",children:[{name:"index",route:"/blog/goodbye-wordpress",frontMatter:{title:"Goodbye WordPress, Hello Gatsby",author:"Paul Cook",type:"post",date:"2019-04-30T11:27:09.000Z",path:"goodbye-wordpress",timeline_notification:[1554377232],categories:"Gatsby",featuredImage:"./goodbye.jpg",description:"I've had a good run with WordPress. Time for something new. See ya later, WordPress. Hello Gatsby."}}],route:"/blog/goodbye-wordpress"},{name:"how-i-got-a-job",children:[{name:"index",route:"/blog/how-i-got-a-job",frontMatter:{title:"My Story: How I went from zero to having a job in web development over a summer",author:"Paul Cook",type:"post",date:"2017-08-06T15:41:30.000Z",path:"how-i-got-a-job",categories:["Career"],tags:"Breaking Into Tech, Code Louisville, Job Search",featuredImage:"./tirza-van-dijk-58298-1.jpg",description:"How I broke into tech with a degree in theology."}}],route:"/blog/how-i-got-a-job"},{name:"index",route:"/blog",frontMatter:{type:"posts",title:"Posts",date:"2021-03-18T00:00:00.000Z"}},{name:"ineffectiveness",children:[{name:"index",route:"/blog/ineffectiveness",frontMatter:{title:"Why you are ineffective",author:"Paul Cook",type:"post",date:"2019-01-31T03:00:58.000Z",path:"ineffectiveness",timeline_notification:[1548906907],categories:"Career, Effective Executive",tags:["Book Notes","Productivity"],featuredImage:"./effectiveness-can-be-learned.png",description:"In order to master the habits of effectiveness we need to first understand what's holding us back."}}],route:"/blog/ineffectiveness"},{name:"introducing-the-effective-executive",children:[{name:"index",route:"/blog/introducing-the-effective-executive",frontMatter:{title:"The Effective Executive",author:"Paul Cook",type:"post",date:"2019-01-12T15:16:21.000Z",description:"As Peter Drucker says, \u201ceffectiveness can be learned\u2013\u2013and it also has to be learned.\u201d",path:"introducing-the-effective-executive",timeline_notification:[1547306184],categories:"Career, Effective Executive",tags:"Book Notes, Productivity",featuredImage:"./effectiveness-can-be-learned.png"}}],route:"/blog/introducing-the-effective-executive"},{name:"know-thy-time",children:[{name:"index",route:"/blog/know-thy-time",frontMatter:{title:"Know thy time",author:"Paul Cook",type:"post",date:"2019-03-02T16:01:11.000Z",path:"know-thy-time",timeline_notification:[1551542475],categories:"Career, Effective Executive",tags:"Book Notes, Productivity",featuredImage:"./effectiveness-can-be-learned.png",description:"We all have the same 24 hours. Why do some people seem to get so much more done in it?"}}],route:"/blog/know-thy-time"},{name:"no-zero-days",children:[{name:"index",route:"/blog/no-zero-days",frontMatter:{title:"No Zero Days",author:"Paul Cook",type:"post",date:"2019-04-04T11:27:09.000Z",path:"no-zero-days",timeline_notification:[1554377232],categories:"Learning, Life",featuredImage:"./zero-days.jpg",description:"We've all experienced starting a new habit that we're passionate about and then watching it fall apart at the first trouble. How do we stop it?"}}],route:"/blog/no-zero-days"},{name:"painless-code-reviews",children:[{name:"index",route:"/blog/painless-code-reviews",frontMatter:{title:"Painless Code Reviews",author:"Paul Cook",type:"post",date:"2020-05-27T10:27:09.000Z",path:"painless-code-reviews",categories:"Co
1de Review, Teamwork",featuredImage:"./computer-and-desk.jpg",description:"Advice for making your code painless to review"}}],route:"/blog/painless-code-reviews"},{name:"product-management-tools",children:[{name:"index",route:"/blog/product-management-tools",frontMatter:{title:"Product management doesn't have to be hard: 5 tools you can steal from Basecamp today",author:"Paul Cook",type:"post",date:"2020-08-08T05:30:09.000Z",path:"product-management-tools",categories:"Product Management, Shape Up, Product Development",featuredImage:"./sticky-notes.jpg",description:"Tools for building better products from Shape Up"}}],route:"/blog/product-management-tools"},{name:"simple-made-easy",children:[{name:"index",route:"/blog/simple-made-easy",frontMatter:{title:"8 Things I Learned from Rich Hickey That Helped Me Write Better Software (Simple Made Easy)",author:"Paul Cook",type:"post",date:"2020-02-10T19:27:09.000Z",path:"simple-made-easy",categories:"Software Design, Talks, Rich Hickey",featuredImage:"./rich-hickey.jpg",description:"Wisdom from the man behind Closure"}}],route:"/blog/simple-made-easy"},{name:"small-changes",children:[{name:"index",route:"/blog/small-changes",frontMatter:{title:"The compounding awesomeness of continually fixing small broken things",author:"Paul Cook",type:"post",date:"2019-10-16T05:30:00.000Z",path:"small-changes",categories:"Refactoring, Legacy Code",featuredImage:"./birds.jpg",description:"Or how your codebase can be 37 times better in a year."}}],route:"/blog/small-changes"},{name:"that-app-wont-save-you",children:[{name:"index",route:"/blog/that-app-wont-save-you",frontMatter:{title:"That app won\u2019t save you",author:"Paul Cook",type:"post",date:"2019-01-11T00:32:15.000Z",path:"that-app-wont-save-you",timeline_notification:[1547166741],categories:"Life",tags:"apps",featuredImage:"./apps.jpeg",description:"Silicon Valley wants you to believe that their next app or social network will make your life everything you want it to be. It won't."}}],route:"/blog/that-app-wont-save-you"},{name:"today-we-are-all-executives",children:[{name:"index",route:"/blog/today-we-are-all-executives",frontMatter:{title:"Today, we are all executives",author:"Paul Cook",type:"post",date:"2019-01-17T12:50:27.000Z",path:"today-we-are-all-executives",timeline_notification:[1547729431],categories:"Career, Effective Executive",tags:"Book Notes, Productivity",featuredImage:"./effectiveness-can-be-learned.png",description:"The age where you simply do what you're told cranking widgets all day every day is dead and gone. Today, we are all executives."}}],route:"/blog/today-we-are-all-executives"},{name:"totally-winging-it",children:[{name:"index",route:"/blog/totally-winging-it",frontMatter:{title:"Nobody knows what they\u2019re doing",author:"Paul Cook",type:"post",date:"2018-12-16T01:50:25.000Z",description:"I used to think other people knew what they were doing. I was wrong.",path:"totally-winging-it",timeline_notification:[1544925030],categories:"Career",featuredImage:"./meeting.jpg"}}],route:"/blog/totally-winging-it"},{name:"url-redirects-gatsby-netlify",children:[{name:"index",route:"/blog/url-redirects-gatsby-netlify",frontMatter:{title:"URL Redirects Using Gatsby and Netlify",author:"Paul Cook",type:"post",date:"2019-10-05T11:27:09.000Z",path:"url-redirects-gatsby-netlify",categories:"Gatsby, Netlify",featuredImage:"./redirects-gatsby-netlify.png",description:"How do you create redirects for your Gatsby site hosted on Netlify?"}}],route:"/blog/url-redirects-gatsby-netlify"}],route:"/blog"},{name:"index",route:"/",frontMatter:{type:"page",title:"About",date:"2021-03-19T00:00:00.000Z"}},{name:"tags",children:[{name:"[tag]",route:"/tags/[tag]",frontMatter:{type:"tag",title:"Tagged Posts"}}],route:"/tags"}]},r.Z))(c({},e,{children:u}))}}},function(e){e.O(0,[774,686,888,179],(function(){return t=1598,e(e.s=t);var t}));var t=e.O();_N_E=t}]);

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.