[{"data":1,"prerenderedAt":1006},["ShallowReactive",2],{"post-\u002Fposts\u002Fhow-to-add-tailwindcss-to-nuxt":3,"post-author-garywoodfine":614,"post-aside-video-none":6,"\u002Fposts\u002Fhow-to-add-tailwindcss-to-nuxt-surround":623,"navigation":634,"authors":682,"author-garywoodfine":711,"post-aside-related-candidates":712,"content-section-services":982,"content-section-products":985,"content-section-company":988,"legal-link":990},{"id":4,"title":5,"aside":6,"author":7,"body":8,"category":592,"date":593,"description":594,"extension":595,"featureImage":596,"meta":599,"navigation":438,"path":601,"seo":602,"sitemap":603,"slug":6,"stem":611,"subtitle":612,"summary":594,"tags":6,"updated":6,"video":6,"__hash__":613},"posts\u002Fposts\u002Fhow-to-add-tailwindcss-to-nuxt.md","How to add tailwindcss to nuxt",null,"garywoodfine",{"type":9,"value":10,"toc":582},"minimark",[11,21,24,29,32,35,38,42,61,64,68,71,74,77,86,90,104,107,136,142,246,250,256,261,269,273,283,375,378,383,386,389,396,408,411,415,418,429,455,462,568,572,578],[12,13,14,15,20],"p",{},"In ",[16,17,19],"a",{"href":18},"getting-started-with-nuxt","Getting started with nuxt"," we walked through the basics of creating a web project with\nnuxt and introduced some of the capabilities of nuxi the Nuxt CLI.",[12,22,23],{},"In this guide we are going to delve a little deeper and learn a few additional concepts and processes to use while\nworking with Nuxt, while also implementing Tailwind CSS.",[25,26,28],"h3",{"id":27},"what-is-tailwind-css","What is Tailwind CSS",[12,30,31],{},"Tailwind is define as a utility-first CSS framework. Which sounds great but what exactly does that really geeky phrase mean?",[12,33,34],{},"In contrast to other CSS frameworks like Bootstrap or Materialize CSS, Tailwind CSS doesn’t come with predefined\ncomponents. Instead Tailwind CSS operates on a lower level and provides you with a set of CSS helper classes, using\nthese classes you can rapidly create custom design with ease.",[12,36,37],{},"Tailwind CSS is not opinionated and doesn't confine you to component boundaries instead it enables you can create your\nown unique designs. Tailwind provides a faster UI building process, providing utility classes to build custom designs\nwithout the need to write CSS.",[25,39,41],{"id":40},"advantages-of-tailwind-css","Advantages of Tailwind CSS",[43,44,45,49,52,55,58],"ul",{},[46,47,48],"li",{},"No need to define custome CSS classes and Id’s.",[46,50,51],{},"Minimum lines of Code in CSS file.",[46,53,54],{},"customise the designs to create your own components.",[46,56,57],{},"Built to be responsive.",[46,59,60],{},"Makes the changes in the desired manner.",[12,62,63],{},"What is even easier is that implementing Tailwind CSS is even easier because we can just use a module to do the work\nfor us.",[25,65,67],{"id":66},"what-is-a-nuxt-module","What is a Nuxt Module",[12,69,70],{},"Nuxt provides what is termed as a higher-order module system which basically provides developers the capability to\nextend the core, without having to edit the core code. Modules are essentially functions that are called sequentially\nwhen booting Nuxt.",[12,72,73],{},"Nuxt modules can be distributed via npm packages. This makes it possible for them to be reused across mulitple projects\nand shared with the community, helping to create an ecosystem of high-quality add-ons.",[12,75,76],{},"Nuxt itself has been developed using a modular structure and by default ships with a number modules that are already\navailable, we will be touching more on this later in this post.",[12,78,79,80],{},"Adding modules to Nuxt is really easy and there are literally ",[16,81,85],{"href":82,"rel":83},"https:\u002F\u002Fnuxt.com\u002Fmodules?category=Libraries",[84],"nofollow","100's of modules available",[25,87,89],{"id":88},"add-tallwindcss-to-your-nuxt-project","Add TallwindCss to your Nuxt Project",[12,91,92,93,97,98,103],{},"The first step to adding TailwindCss to your project is to use ",[94,95,96],"code",{},"nuxi"," to add the ",[16,99,102],{"href":100,"rel":101},"https:\u002F\u002Ftailwindcss.nuxtjs.org\u002F",[84],"Nuxt Tailwind","\nmodule to your project. The Nuxt TailwindCSS module is an integration that incorporates TailwindCSS into\nyour Nuxt application, enabling rapid and efficient styling of your web projects.",[12,105,106],{},"To add the Nuxt TailwindCSS module to your project use the command below.",[108,109,116],"pre",{"className":110,"code":111,"filename":112,"language":113,"meta":114,"style":115},"language-shell shiki shiki-themes material-theme-lighter monokai monokai monokai","nuxi module add tailwindcss\n","Terminal","shell","meta-info=val","",[94,117,118],{"__ignoreMap":115},[119,120,123,126,130,133],"span",{"class":121,"line":122},"line",1,[119,124,96],{"class":125},"sC-bC",[119,127,129],{"class":128},"sKdu0"," module",[119,131,132],{"class":128}," add",[119,134,135],{"class":128}," tailwindcss\n",[12,137,138,139],{},"This command will not only add the module to your project, but it will also configure it in your ",[94,140,141],{},"nuxt.config.ts",[108,143,147],{"className":144,"code":145,"filename":141,"language":146,"meta":114,"style":115},"language-ts shiki shiki-themes material-theme-lighter monokai monokai monokai","export default defineNuxtConfig({\n  compatibilityDate: '2024-04-03',\n  devtools: { enabled: true },\n  modules: ['@nuxtjs\u002Ftailwindcss']\n})\n","ts",[94,148,149,170,193,216,237],{"__ignoreMap":115},[119,150,151,155,158,162,166],{"class":121,"line":122},[119,152,154],{"class":153},"s7SBB","export",[119,156,157],{"class":153}," default",[119,159,161],{"class":160},"s_vVk"," defineNuxtConfig",[119,163,165],{"class":164},"sRVMn","(",[119,167,169],{"class":168},"s8B1f","{\n",[119,171,173,177,180,184,187,190],{"class":121,"line":172},2,[119,174,176],{"class":175},"sB8Ws","  compatibilityDate",[119,178,179],{"class":168},":",[119,181,183],{"class":182},"sxJtY"," '",[119,185,186],{"class":128},"2024-04-03",[119,188,189],{"class":182},"'",[119,191,192],{"class":168},",\n",[119,194,196,199,201,204,207,209,213],{"class":121,"line":195},3,[119,197,198],{"class":175},"  devtools",[119,200,179],{"class":168},[119,202,203],{"class":168}," {",[119,205,206],{"class":175}," enabled",[119,208,179],{"class":168},[119,210,212],{"class":211},"scY0H"," true",[119,214,215],{"class":168}," },\n",[119,217,219,222,224,227,229,232,234],{"class":121,"line":218},4,[119,220,221],{"class":175},"  modules",[119,223,179],{"class":168},[119,225,226],{"class":164}," [",[119,228,189],{"class":182},[119,230,231],{"class":128},"@nuxtjs\u002Ftailwindcss",[119,233,189],{"class":182},[119,235,236],{"class":164},"]\n",[119,238,240,243],{"class":121,"line":239},5,[119,241,242],{"class":168},"}",[119,244,245],{"class":164},")\n",[25,247,249],{"id":248},"what-is-nuxtconfigts","What is nuxt.config.ts",[12,251,252,253,255],{},"The ",[94,254,141],{}," file is a crucial configuration file in a Nuxt project that defines the global settings and\nbehaviours for the application. Written in TypeScript, this file enables developers to use static typing and type\nchecking to improve code quality and development experience.",[12,257,252,258,260],{},[94,259,141],{}," file serves multiple purposes:",[43,262,263,266],{},[46,264,265],{},"configures modules, plugins, middleware, server-side rendering settings, and performance optimisations, among other things.",[46,267,268],{},"centralises these configurations, it provides a clear and organised way to manage various aspects of a\nNuxt application, ensuring consistency and maintainability across the project.",[25,270,272],{"id":271},"using-tailwindcss","Using TailwindCSS",[12,274,275,276,278,279,282],{},"For the most part your application, will at least at a very basic level be now configured to use TailwindCSS. Let's do a\nvery simple check to ensure. If you were following on from ",[16,277,19],{"href":18},", we\nedited our ",[94,280,281],{},"app.vue"," added a very simple greeting, the obligatory \"Hello World!\".  We can now add a little colour to\nthat by making use of Tailwind, simply edit the file as follows",[108,284,288],{"className":285,"code":286,"filename":281,"language":287,"meta":114,"style":115},"language-vue shiki shiki-themes material-theme-lighter monokai monokai monokai","\u003Ctemplate>\n  \u003Cdiv>\n    \u003CNuxtRouteAnnouncer\u002F>\n    \u003Cp class=\"text-orange-500 text-4xl font-bold\"> Hello World!\u003C\u002Fp>\n  \u003C\u002Fdiv>\n\u003C\u002Ftemplate>\n","vue",[94,289,290,302,312,323,357,366],{"__ignoreMap":115},[119,291,292,295,299],{"class":121,"line":122},[119,293,294],{"class":168},"\u003C",[119,296,298],{"class":297},"sMgo4","template",[119,300,301],{"class":168},">\n",[119,303,304,307,310],{"class":121,"line":172},[119,305,306],{"class":168},"  \u003C",[119,308,309],{"class":297},"div",[119,311,301],{"class":168},[119,313,314,317,320],{"class":121,"line":195},[119,315,316],{"class":168},"    \u003C",[119,318,319],{"class":297},"NuxtRouteAnnouncer",[119,321,322],{"class":168},"\u002F>\n",[119,324,325,327,329,333,336,339,342,344,347,350,353,355],{"class":121,"line":218},[119,326,316],{"class":168},[119,328,12],{"class":297},[119,330,332],{"class":331},"sE8jp"," class",[119,334,335],{"class":168},"=",[119,337,338],{"class":182},"\"",[119,340,341],{"class":128},"text-orange-500 text-4xl font-bold",[119,343,338],{"class":182},[119,345,346],{"class":168},">",[119,348,349],{"class":164}," Hello World!",[119,351,352],{"class":168},"\u003C\u002F",[119,354,12],{"class":297},[119,356,301],{"class":168},[119,358,359,362,364],{"class":121,"line":239},[119,360,361],{"class":168},"  \u003C\u002F",[119,363,309],{"class":297},[119,365,301],{"class":168},[119,367,369,371,373],{"class":121,"line":368},6,[119,370,352],{"class":168},[119,372,298],{"class":297},[119,374,301],{"class":168},[12,376,377],{},"View the application in your browser and it will now look something similar to the below.",[379,380],"content-image",{"image":381,"title":382},"hello-tailwind_lktzve","Nuxt Tailwind Hello World",[12,384,385],{},"Nothing too dramatic, but it proves that our application is now configured correctly and we are using Tailwind.",[12,387,388],{},"Under the hood, the Tailwind Module does a few things automatically for you, abstracting some of the intricacies\nof Tailwind configuration for you.",[12,390,391,392,395],{},"When running ",[94,393,394],{},"yarn dev",", this module will look for these files:",[43,397,398,403],{},[46,399,400],{},[94,401,402],{},".\u002Fassets\u002Fcss\u002Ftailwind.css",[46,404,405],{},[94,406,407],{},".\u002Ftailwind.config.{js,cjs,mjs,ts}",[12,409,410],{},"If these files don't exist, the module will automatically generate a basic configuration for them, so you don't\nhave to create these files manually.",[25,412,414],{"id":413},"additional-tailwind-configuration","Additional tailwind configuration",[12,416,417],{},"In most cases, when working with Tailwind you will undoubtedly want to do more advanced styling and configurations.\nThis again can't quite easily be achieved using the CLI etc.",[12,419,420,421,424,425,428],{},"One of the first steps you'll more than likely want to do is add Tailwind Configuration file, namely ",[94,422,423],{},"tailwind.config","\nand this can be using the npx command below and including the ",[94,426,427],{},"--ts"," switch to instruct generating the TypeScript\nversion of the file",[108,430,432],{"className":110,"code":431,"filename":112,"language":113,"meta":114,"style":115},"\nnpx tailwindcss init --ts\n",[94,433,434,440],{"__ignoreMap":115},[119,435,436],{"class":121,"line":122},[119,437,439],{"emptyLinePlaceholder":438},true,"\n",[119,441,442,445,448,451],{"class":121,"line":172},[119,443,444],{"class":125},"npx",[119,446,447],{"class":128}," tailwindcss",[119,449,450],{"class":128}," init",[119,452,454],{"class":453},"sbSe9"," --ts\n",[12,456,457,458,461],{},"This will generate the ",[94,459,460],{},"tailwind.config.ts"," file in the root of your project directory and will look something similar\ntoo",[108,463,465],{"className":144,"code":464,"filename":460,"language":146,"meta":114,"style":115},"import type { Config } from 'tailwindcss'\n\nexport default {\n  content: [],\n  theme: {\n    extend: {},\n  },\n  plugins: [],\n} satisfies Config\n",[94,466,467,494,498,507,519,528,538,544,556],{"__ignoreMap":115},[119,468,469,472,475,477,480,483,486,488,491],{"class":121,"line":122},[119,470,471],{"class":153},"import",[119,473,474],{"class":153}," type",[119,476,203],{"class":168},[119,478,479],{"class":164}," Config",[119,481,482],{"class":168}," }",[119,484,485],{"class":153}," from",[119,487,183],{"class":182},[119,489,490],{"class":128},"tailwindcss",[119,492,493],{"class":182},"'\n",[119,495,496],{"class":121,"line":172},[119,497,439],{"emptyLinePlaceholder":438},[119,499,500,502,504],{"class":121,"line":195},[119,501,154],{"class":153},[119,503,157],{"class":153},[119,505,506],{"class":168}," {\n",[119,508,509,512,514,517],{"class":121,"line":218},[119,510,511],{"class":175},"  content",[119,513,179],{"class":168},[119,515,516],{"class":164}," []",[119,518,192],{"class":168},[119,520,521,524,526],{"class":121,"line":239},[119,522,523],{"class":175},"  theme",[119,525,179],{"class":168},[119,527,506],{"class":168},[119,529,530,533,535],{"class":121,"line":368},[119,531,532],{"class":175},"    extend",[119,534,179],{"class":168},[119,536,537],{"class":168}," {},\n",[119,539,541],{"class":121,"line":540},7,[119,542,543],{"class":168},"  },\n",[119,545,547,550,552,554],{"class":121,"line":546},8,[119,548,549],{"class":175},"  plugins",[119,551,179],{"class":168},[119,553,516],{"class":164},[119,555,192],{"class":168},[119,557,559,561,564],{"class":121,"line":558},9,[119,560,242],{"class":168},[119,562,563],{"class":153}," satisfies",[119,565,567],{"class":566},"sIQzR"," Config\n",[25,569,571],{"id":570},"conclusion","Conclusion",[12,573,574,575,577],{},"We have now configured our project to make use of Tailwindcss by adding a custom Nuxt module and configured the\nmodule directly in our ",[94,576,141],{},". We can add additional modules, as we progress through this tutorial series\nwe will continue to do so. However, for now we will leave it here and look forward to the next tutorial in the series.",[579,580,581],"style",{},"html pre.shiki code .sC-bC, html code.shiki .sC-bC{--shiki-light:#E2931D;--shiki-default:#A6E22E;--shiki-dark:#A6E22E;--shiki-sepia:#A6E22E}html pre.shiki code .sKdu0, html code.shiki .sKdu0{--shiki-light:#91B859;--shiki-default:#E6DB74;--shiki-dark:#E6DB74;--shiki-sepia:#E6DB74}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html .sepia .shiki span {color: var(--shiki-sepia);background: var(--shiki-sepia-bg);font-style: var(--shiki-sepia-font-style);font-weight: var(--shiki-sepia-font-weight);text-decoration: var(--shiki-sepia-text-decoration);}html.sepia .shiki span {color: var(--shiki-sepia);background: var(--shiki-sepia-bg);font-style: var(--shiki-sepia-font-style);font-weight: var(--shiki-sepia-font-weight);text-decoration: var(--shiki-sepia-text-decoration);}html pre.shiki code .s7SBB, html code.shiki .s7SBB{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#F92672;--shiki-default-font-style:inherit;--shiki-dark:#F92672;--shiki-dark-font-style:inherit;--shiki-sepia:#F92672;--shiki-sepia-font-style:inherit}html pre.shiki code .s_vVk, html code.shiki .s_vVk{--shiki-light:#6182B8;--shiki-default:#A6E22E;--shiki-dark:#A6E22E;--shiki-sepia:#A6E22E}html pre.shiki code .sRVMn, html code.shiki .sRVMn{--shiki-light:#90A4AE;--shiki-default:#F8F8F2;--shiki-dark:#F8F8F2;--shiki-sepia:#F8F8F2}html pre.shiki code .s8B1f, html code.shiki .s8B1f{--shiki-light:#39ADB5;--shiki-default:#F8F8F2;--shiki-dark:#F8F8F2;--shiki-sepia:#F8F8F2}html pre.shiki code .sB8Ws, html code.shiki .sB8Ws{--shiki-light:#E53935;--shiki-default:#F8F8F2;--shiki-dark:#F8F8F2;--shiki-sepia:#F8F8F2}html pre.shiki code .sxJtY, html code.shiki .sxJtY{--shiki-light:#39ADB5;--shiki-default:#E6DB74;--shiki-dark:#E6DB74;--shiki-sepia:#E6DB74}html pre.shiki code .scY0H, html code.shiki .scY0H{--shiki-light:#FF5370;--shiki-default:#AE81FF;--shiki-dark:#AE81FF;--shiki-sepia:#AE81FF}html pre.shiki code .sMgo4, html code.shiki .sMgo4{--shiki-light:#E53935;--shiki-default:#F92672;--shiki-dark:#F92672;--shiki-sepia:#F92672}html pre.shiki code .sE8jp, html code.shiki .sE8jp{--shiki-light:#9C3EDA;--shiki-default:#A6E22E;--shiki-dark:#A6E22E;--shiki-sepia:#A6E22E}html pre.shiki code .sbSe9, html code.shiki .sbSe9{--shiki-light:#91B859;--shiki-default:#AE81FF;--shiki-dark:#AE81FF;--shiki-sepia:#AE81FF}html pre.shiki code .sIQzR, html code.shiki .sIQzR{--shiki-light:#E2931D;--shiki-light-text-decoration:inherit;--shiki-default:#A6E22E;--shiki-default-text-decoration:underline;--shiki-dark:#A6E22E;--shiki-dark-text-decoration:underline;--shiki-sepia:#A6E22E;--shiki-sepia-text-decoration:underline}",{"title":115,"searchDepth":172,"depth":172,"links":583},[584,585,586,587,588,589,590,591],{"id":27,"depth":195,"text":28},{"id":40,"depth":195,"text":41},{"id":66,"depth":195,"text":67},{"id":88,"depth":195,"text":89},{"id":248,"depth":195,"text":249},{"id":271,"depth":195,"text":272},{"id":413,"depth":195,"text":414},{"id":570,"depth":195,"text":571},"development","2024-10-07","Explore the Nuxt framework and how to start a new project using Nuxt and Vue","md",{"url":597,"title":598},"v1690313878\u002Fnuxt-header_tbc9cp","Getting started with Nuxt",{"publishDateTime":600},"2024-10-07:17:30","\u002Fposts\u002Fhow-to-add-tailwindcss-to-nuxt",{"title":5,"description":594},{"loc":601,"lastmod":593,"changefreq":604,"priority":605,"images":606},"monthly",0.8,[607,609],{"loc":608},"https:\u002F\u002Fres.cloudinary.com\u002Fthreenine-co-uk\u002Fimage\u002Fupload\u002Ff_jpg,w_1200\u002Fv1690313878\u002Fnuxt-header_tbc9cp",{"loc":610},"https:\u002F\u002Fres.cloudinary.com\u002Fthreenine-co-uk\u002Fimage\u002Fupload\u002Ff_jpg,w_1200\u002Fhello-tailwind_lktzve","posts\u002Fhow-to-add-tailwindcss-to-nuxt","set up and customise Tailwind in Nuxt","jFE9Qdss5zyN757pOPxTPsUNpOTRTCwxj2zfXsDusbQ",{"name":615,"to":616,"avatar":617,"sameAs":618},"Gary Woodfine","https:\u002F\u002Fgarywoodfine.com","garywoodfine_tlccjw",[619,620,621,622],"https:\u002F\u002Fgithub.com\u002Fgarywoodfine","https:\u002F\u002Fwww.youtube.com\u002F@Threenineio","https:\u002F\u002Fnjump.me\u002Fnpub1a3jz7w9laar2k77dkkh2rhxunr9zpja5emrl5yrxetamt29swqyqmmt32y","nostr:npub1a3jz7w9laar2k77dkkh2rhxunr9zpja5emrl5yrxetamt29swqyqmmt32y",[624,629],{"title":625,"path":626,"stem":627,"description":628,"children":-1},"An introductory guide to API Development","\u002Fposts\u002Fguide-api-development","posts\u002Fguide-api-development","threenine.io covers introductory concepts, terminology & technologies related to API development in order to gain a basic understanding.",{"title":630,"path":631,"stem":632,"description":633,"children":-1},"How to create a WebSocket server in dotnet","\u002Fposts\u002Fhow-to-create-a-websocket-server-in-dotnet","posts\u002Fhow-to-create-a-websocket-server-in-dotnet","A walk-through guide on how to implement WebSocket end points in dotnet",{"id":635,"extension":636,"items":637,"meta":679,"stem":680,"__hash__":681},"navigation\u002Fnavigation.yaml","yaml",[638,651,664,672],{"label":639,"children":640},"products",[641,646],{"label":642,"icon":643,"description":644,"to":645},"Diogel","material-symbols:preview","Keep your Nostr identity in your hands, in your browser, on your phone or on your own server.","\u002Fproducts\u002Fdiogel",{"label":647,"icon":648,"description":649,"to":650},"Nostrfi","i-lucide-radio-tower","Nostr relay, storage and backend-service infrastructure for builders and operators.","\u002Fproducts\u002Fnostrfi",{"label":652,"children":653},"services",[654,659],{"label":655,"description":656,"icon":657,"to":658},"Nostr product development","Focused engineering support for teams building Nostr-native products, tools and protocol-aware user experiences.","game-icons:ostrich","\u002Fservices\u002Fnostr-product-development",{"label":660,"description":661,"icon":662,"to":663},"Bitcoin product development","Engineering for Bitcoin payments, wallet-connected flows and products where users hold their own keys.","bx:bxl-bitcoin","\u002Fservices\u002Fbitcoin-product-development",{"label":665,"children":666},"company",[667],{"label":668,"icon":669,"description":670,"to":671},"About","i-lucide-file-text","What we believe, what we build and how we work.","\u002Fcompany\u002Fabout",{"label":673,"children":674},"resources",[675],{"label":676,"icon":669,"description":677,"to":678},"Blog","Practical Bitcoin, Nostr and product engineering guides.","https:\u002F\u002Fthreenine.blog",{},"navigation","n-Xc9COCwoCHJiMCeBNLauHtuhxcGol-wu9S2og3Rqs",{"id":683,"title":615,"avatar":617,"body":684,"description":688,"extension":595,"meta":703,"name":615,"navigation":438,"path":704,"role":705,"sameAs":706,"seo":707,"stem":708,"summary":709,"to":616,"username":7,"__hash__":710},"authors\u002Fauthors\u002FGary Woodfine.md",{"type":9,"value":685,"toc":701},[686,689,692,695,698],[12,687,688],{},"Polyglot software engineer with extensive experience in software engineering, with a passion to build great scalable software to solve complex business problems. A track record in developing high-performance backend systems, optimizing architecture, and ensuring continuous availability of critical APIs.",[12,690,691],{},"I'm an independent software developer, vendor, architect, consultant, blogger, Bitcoin & Nostr Enthusiast. I've provided software development expertise and helped augment software development skills and teams for a number of startups, product companies, corporate IT shops, and consulting firms.",[12,693,694],{},"I started out in the software world back in 1995, building websites with HoTMetaL Pro & ASP and moved on to building web apps with .NET when it released in Beta in 2001, since then, I've shipped systems in just about every industry.",[12,696,697],{},"Along my journey, I have also shipped various platforms & products in a number of other programming languages or software development frameworks that have had their moments in the sun, but somehow I have always made way back to C# & .Net.",[12,699,700],{},"Over the years, I've strived to improve how I and my teams deliver value to the clients, customers, and end-users. That has led me down the path of exploring Agile, Domain-Driven Design, REST, messaging, distributed systems, and anything else I thought could help.",{"title":115,"searchDepth":172,"depth":172,"links":702},[],{},"\u002Fauthors\u002Fgary-woodfine","Managing Director",[619,620,621,622],{"title":615,"description":688},"authors\u002FGary Woodfine","independent software developer, vendor, architect, consultant, blogger, Bitcoin & Nostr Enthusiast. I've provided software development expertise and helped augment software development skills and teams for a number of startups, product companies, corporate IT shops, and consulting firms.","30ZWJ-6T2g8S0kLLgUhZWA7_QFUOpa5CElif7tAhsLo",{"title":615,"name":615,"role":705,"summary":709,"avatar":617,"username":7,"to":616},[713,725,736,743,750,757,768,777,783,790,796,803,813,822,828,834,839,844,853,859,864,866,870,875,880,885,890,895,901,906,913,922,926,931,939,944,950,955,960,964,968,973,977],{"path":714,"title":715,"date":716,"tags":717,"category":718,"featureImage":723},"\u002Fposts\u002Fwhat-is-a-nostr-client","What is a Nostr client?","2026-10-26",[718,719,720,721,722],"nostr","nostr-client","privacy","keys","getting-started",{"url":724,"title":715},"v1690313893\u002Fnostr-logo_hwrql1",{"path":726,"title":727,"date":728,"tags":729,"category":718,"featureImage":734},"\u002Fposts\u002Fhow-to-choose-nostr-relays","How to Choose Nostr Relays","2026-04-11",[718,730,720,731,732,733],"relay","security","nostr-relays","censorship-resistance",{"url":724,"title":735},"How to choose nostr relays",{"path":737,"title":738,"date":728,"tags":739,"category":718,"featureImage":742},"\u002Fposts\u002Fnostr-relays-privacy-and-security","Nostr Relays, Privacy, and Security",[718,730,720,731,740,741],"key-management","nostr-relay",{"url":724,"title":738},{"path":744,"title":745,"date":728,"tags":746,"category":718,"featureImage":748},"\u002Fposts\u002Fwhat-is-a-nostr-relay","What is a Nostr Relay?",[718,730,720,733,747,741],"decentralization",{"url":724,"title":749}," What is a Nostr Relay?",{"path":751,"title":752,"date":753,"tags":754,"category":718,"featureImage":756},"\u002Fposts\u002Fwhy-nostr-keys-better-privacy","Why Nostr keys and identity are better for privacy","2026-04-06",[718,720,755,731],"identity",{"url":724,"title":752},{"path":758,"title":759,"date":760,"tags":761,"category":718,"featureImage":767},"\u002Fposts\u002Fbest-nostr-browser-extensions-2026","Best Nostr Browser Extensions (2026): Complete Comparison","2026-03-24",[718,762,763,731,764,765,766],"browser-extension","nip-07","comparison","porwr","diogel",{"url":724,"title":759},{"path":769,"title":770,"date":760,"tags":771,"category":718,"featureImage":774},"\u002Fposts\u002Fhow-to-get-started-with-porwr","Getting Started with Nostr: Porwr Setup Guide (2026)",[772,720,718,765,766,773,763,762],"social","cryptography",{"url":775,"title":776},"v1690313893\u002Fblog\u002Fdiogel-product-header_x3az6t","Porwr Browser Extension",{"path":778,"title":779,"date":780,"tags":781,"category":718,"featureImage":782},"\u002Fposts\u002Fhow-to-manage-keys-for-nostr","How to manage keys for Nostr","2025-12-15",[718,721,720,731],{"url":724,"title":779},{"path":784,"title":785,"date":780,"tags":786,"category":718,"featureImage":789},"\u002Fposts\u002Fhow-to-self-host-your-nip-05-identity","How to self-host your NIP-05 identity",[718,787,720,788],"nip-05","self-hosting",{"url":724,"title":785},{"path":791,"title":792,"date":793,"tags":6,"category":720,"featureImage":794},"\u002Fposts\u002Fwhy-privacy-is-a-fundamental-human-right","Why privacy is a fundamental human right","2025-12-09",{"url":795,"title":792},"v1690313893\u002Fprivacy-header_exiblo",{"path":797,"title":798,"date":799,"tags":6,"category":800,"featureImage":801},"\u002Fposts\u002Fhow-government-monetary-policy-erodes-the-value-of-money","How government monetary policy erodes the value of money","2025-12-01","bitcoin",{"url":802,"title":798},"v1719908027\u002Fbitcoin_szcm1m",{"path":804,"title":805,"date":806,"tags":807,"category":800,"featureImage":811},"\u002Fposts\u002Fbitaxe-touch-genesis-batch","Bitaxe Touch Genesis Batch","2025-07-23",[808,809,810],"bitaxe","mining","solo",{"url":812,"title":805},"v1690313878\u002Fbitaxe-touch_c6qrjd",{"path":814,"title":815,"date":816,"tags":817,"category":800,"featureImage":821},"\u002Fposts\u002Fbitcoin-is-not-a-ponzi-scheme","Bitcoin is not a Ponzi Scheme","2025-07-22",[818,819,820],"ponzi","economics","investment",{"url":802,"title":815},{"path":823,"title":824,"date":816,"tags":825,"category":800,"featureImage":827},"\u002Fposts\u002Fgetting-started-with-public-pool-mining","Getting started with Public Pool Mining",[809,810,826],"lottery",{"url":802,"title":824},{"path":829,"title":830,"date":831,"tags":832,"category":800,"featureImage":833},"\u002Fposts\u002Fgetting-started-with-solo-mining","Getting started with solo mining","2025-07-19",[808,809,810,826],{"url":802,"title":830},{"path":835,"title":836,"date":831,"tags":837,"category":800,"featureImage":838},"\u002Fposts\u002Fwhat-is-bitcoin-mining","What is Bitcoin mining",[809,800],{"url":802,"title":836},{"path":840,"title":841,"date":831,"tags":842,"category":800,"featureImage":843},"\u002Fposts\u002Fwhat-is-solo-mining","What is solo mining",[810],{"url":802,"title":841},{"path":845,"title":846,"date":847,"tags":848,"category":800,"featureImage":851},"\u002Fposts\u002Fhow-to-run-a-bitcoin-node","How to run a Bitcoin Node with Umbrel Home","2025-07-14",[849,850],"node","umbrel",{"url":802,"title":852},"How to run a Bitcoin node",{"path":854,"title":855,"date":856,"tags":857,"category":718,"featureImage":858},"\u002Fposts\u002Fhow-to-get-started-with-nostr","How to get started with Nostr","2024-10-09",[718,722,720,721],{"url":724,"title":855},{"path":860,"title":861,"date":862,"tags":6,"category":592,"featureImage":863},"\u002Fposts\u002Fhow-to-use-layouts-and-pages-in-nuxt","How to use layouts and pages in Nuxt","2024-10-08",{"url":597,"title":861},{"path":601,"title":5,"date":593,"tags":6,"category":592,"featureImage":865},{"url":597,"title":598},{"path":867,"title":598,"date":868,"tags":6,"category":592,"featureImage":869},"\u002Fposts\u002Fgetting-started-with-nuxt","2024-10-06",{"url":597,"title":598},{"path":871,"title":872,"date":868,"tags":6,"category":592,"featureImage":873},"\u002Fposts\u002Fhow-to-store-terraform_state-in-digital-ocean-space","How to store Terraform state in DigitalOcean Spaces",{"url":874,"title":872},"v1690313893\u002Fterraform-header_ixmkgg",{"path":876,"title":877,"date":878,"tags":6,"category":592,"featureImage":879},"\u002Fposts\u002Fhow-to-use-terraform-with-digitalocean","How to use Terraform with DigitalOcean","2024-10-05",{"url":874,"title":877},{"path":881,"title":882,"date":883,"tags":6,"category":720,"featureImage":884},"\u002Fposts\u002Fhow-to-add-fathom-analytics-to-nuxt","How to add Fathom Analytics to Nuxt","2024-07-01",{"url":597,"title":882},{"path":886,"title":887,"date":883,"tags":6,"category":720,"featureImage":888},"\u002Fposts\u002Fimportance-of-privacy-in-web-analytics","The Importance of Privacy in Web Analytics",{"url":889,"title":887},"v1690313893\u002Fanalytics_nlew9f",{"path":891,"title":892,"date":883,"tags":893,"category":718,"featureImage":894},"\u002Fposts\u002Fwhat-is-a-nip-07-signer","What is a NIP-07 signer?",[718,763,762,731],{"url":724,"title":892},{"path":896,"title":897,"date":883,"tags":898,"category":718,"featureImage":900},"\u002Fposts\u002Fwhat-is-nostr","What is Nostr?",[718,899,720,747],"relays",{"url":724,"title":897},{"path":902,"title":903,"date":883,"tags":6,"category":720,"featureImage":904},"\u002Fposts\u002Fwhy-choose-privacy-focused-analytics","Why choose privacy focused Analytics",{"url":905,"title":903},"v1690313893\u002Fblog\u002Ffathom-header_y7s0x2",{"path":907,"title":908,"date":909,"tags":6,"category":592,"featureImage":910},"\u002Fposts\u002Fwhat-is-api-integration","What is API Integration?","2024-06-04",{"url":911,"title":912},"v1719908247\u002Fapi_f3f1mh","What is API integration?",{"path":914,"title":915,"date":916,"tags":917,"category":800,"featureImage":919},"\u002Fposts\u002Fhow-blockchain-uses-cryptography","How Blockchain uses Cryptography","2024-05-18",[918,773],"blockchain",{"url":920,"title":921},"v1690313893\u002Fblockchain_tfrcrd","What is blockchain?",{"path":631,"title":630,"date":923,"tags":6,"category":592,"featureImage":924},"2024-05-15",{"url":925,"title":630},"v1719908486\u002Fwebsockets_pjqtld",{"path":927,"title":928,"date":923,"tags":929,"category":800,"featureImage":930},"\u002Fposts\u002Fwhat-is-blockchain","What is Blockchain",[918,800],{"url":920,"title":921},{"path":932,"title":933,"date":934,"tags":935,"category":800,"featureImage":937},"\u002Fposts\u002Fintroduction-to-public-and-private-key-cryptography","Public Key Cryptography Explained: A Beginner's Guide","2024-05-12",[936,800,718],"encryption",{"url":920,"title":938},"Introduction to public and private key cryptography",{"path":940,"title":941,"date":934,"tags":942,"category":800,"featureImage":943},"\u002Fposts\u002Fwhat-is-bitcoin","What is Bitcoin?",[918,800],{"url":802,"title":941},{"path":945,"title":946,"date":947,"tags":6,"category":592,"featureImage":948},"\u002Fposts\u002Fwhat-are-web-sockets","What are Web Sockets","2023-09-06",{"url":925,"title":949},"What are Websockets",{"path":951,"title":952,"date":953,"tags":6,"category":592,"featureImage":954},"\u002Fposts\u002Fwhat-is-api-first","What is API First?","2023-07-13",{"url":911,"title":952},{"path":956,"title":957,"date":958,"tags":6,"category":592,"featureImage":959},"\u002Fposts\u002Fapi-gateway-pattern","API Gateway Pattern","2023-06-10",{"url":911,"title":957},{"path":961,"title":962,"date":958,"tags":6,"category":592,"featureImage":963},"\u002Fposts\u002Fbackend-for-frontend-design-pattern","Backend for Frontend Design Pattern",{"url":911,"title":962},{"path":626,"title":625,"date":965,"tags":6,"category":592,"featureImage":966},"2023-06-05",{"url":911,"title":967},"API Development",{"path":969,"title":970,"date":965,"tags":6,"category":592,"featureImage":971},"\u002Fposts\u002Fwhat-is-a-rest-api","What is a REST API?",{"url":911,"title":972},"What is an API?",{"path":974,"title":972,"date":975,"tags":6,"category":592,"featureImage":976},"\u002Fposts\u002Fwhat-is-an-api","2023-06-01",{"url":911,"title":972},{"path":978,"title":979,"date":975,"tags":6,"category":592,"featureImage":980},"\u002Fposts\u002Fwhat-is-api-development","What is API Development ?",{"url":911,"title":981},"What is API development?",[983,984],{"label":655,"description":656,"icon":657,"to":658},{"label":660,"description":661,"icon":662,"to":663},[986,987],{"label":642,"icon":643,"description":644,"to":645},{"label":647,"icon":648,"description":649,"to":650},[989],{"label":668,"icon":669,"description":670,"to":671},[991,994,997,1000,1003],{"path":992,"title":993},"\u002Flegals\u002Fcookie-policy","Cookie Policy",{"path":995,"title":996},"\u002Flegals\u002Fcopyright","Copyright",{"path":998,"title":999},"\u002Flegals\u002Fcustomer-support","Customer Support",{"path":1001,"title":1002},"\u002Flegals\u002Fprivacy-policy","Privacy Policy",{"path":1004,"title":1005},"\u002Flegals\u002Fterms-of-service","Terms of Service",1793132669328]