From d98b612b1d77953cea92b085fdb84e51128f4ee9 Mon Sep 17 00:00:00 2001
From: cha0s webscale fullstack?",id:"is-it-webscale-fullstack",level:2},{value:"For real, though",id:"for-real-though",level:3},{value:"Don't get it twisted",id:"dont-get-it-twisted",level:3},{value:"Do one thing and do it well",id:"do-one-thing-and-do-it-well",level:2},{value:"Small core",id:"small-core",level:3},{value:"The flecks way",id:"the-flecks-way",level:3},{value:"Why though?",id:"why-though",level:2},{value:"Separation of concerns",id:"separation-of-concerns",level:3},{value:"Joy",id:"joy",level:3},{value:"Because I can",id:"because-i-can",level:3},{value:"Thanks again",id:"thanks-again",level:2}];function d({children:e}){const t={span:"span",...(0,i.a)()};return(0,s.jsx)(t.span,{style:{fontSize:"0.75em"},children:e})}function u(e){const t={a:"a",admonition:"admonition",code:"code",del:"del",em:"em",h2:"h2",h3:"h3",img:"img",li:"li",mdxAdmonitionTitle:"mdxAdmonitionTitle",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,i.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)(t.p,{children:["Introducing flecks: an ",(0,s.jsx)(t.strong,{children:"exceptionally-extensible application production system"}),"."]}),"\n","\n",(0,s.jsxs)(t.h2,{id:"first-off-thanks-for-your-time-pray",children:["First off, thanks for your time ","\ud83d\ude4f"]}),"\n",(0,s.jsxs)(t.p,{children:["I appreciate you checking out the project! I truly hope that you will find working with flecks\nto be a joy. Feedback is welcome over on the\n",(0,s.jsx)(t.a,{href:"https://github.com/cha0s/flecks/discussions",children:"Github discussions page"}),"!"]}),"\n",(0,s.jsx)(t.admonition,{title:'What\'s the letter before "alpha"?',type:"warning",children:(0,s.jsxs)(t.p,{children:["This is a new release and worked on by only one person: ",(0,s.jsx)(t.a,{href:"https://github.com/cha0s",children:"me"}),"! Please\nkeep this in mind!"]})}),"\n",(0,s.jsxs)(t.h2,{id:"is-it-webscale-fullstack",children:["Is it ",(0,s.jsx)(t.del,{children:"webscale"})," fullstack?"]}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"A screenshot from the 2010 "MongoDB is webscale" cartoon",src:n(6522).Z+"",width:"480",height:"360"}),"\n",(0,s.jsx)("figcaption",{style:{fontSize:"0.8rem"},children:(0,s.jsx)(t.em,{children:"yes, I remember"})})]})}),"\n",(0,s.jsxs)(t.p,{children:["I admit, I clickbaited with the title there just a little bit. I love fullstack! flecks is more\nthan capable of building fullstack applications. If you just want to jump to more of that sort\nof thing, you might be interested in the ",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/react",children:"React"}),"\npage in the documentation."]}),"\n",(0,s.jsx)(t.h3,{id:"for-real-though",children:"For real, though"}),"\n",(0,s.jsxs)(t.p,{children:["A fullstack JS application is basically appception: what you actually have is a server\napplication written in JS that serves a client application written in JS. Using\nthe same language obscures (arguably, ",(0,s.jsx)(t.em,{children:"by design"}),") the fact that these are actually two distinct\napplications."]}),"\n",(0,s.jsx)(t.p,{children:(0,s.jsx)(t.img,{alt:"A screenshot of Doctor Olivia Octopus saying "There's two, actually"",src:n(3069).Z+"",width:"790",height:"371"})}),"\n",(0,s.jsx)(t.admonition,{title:"Hot take",type:"danger",children:(0,s.jsxs)(t.p,{children:["Some modern framework APIs are becoming increasingly obscure in their attempt to paper over\nthis reality\n(",(0,s.jsx)(t.a,{href:"https://github.com/cha0s/flecks/blob/master/packages/react/src/client.js#L24",children:(0,s.jsx)(t.em,{children:"*ahem*"})}),"... and\ndon't get me started on ",(0,s.jsx)(t.a,{href:"https://www.mayank.co/blog/react-server-components/",children:(0,s.jsx)(t.strong,{children:"RSC"})}),"...)."]})}),"\n",(0,s.jsx)(t.h3,{id:"dont-get-it-twisted",children:"Don't get it twisted"}),"\n",(0,s.jsxs)(t.p,{children:["To put it in basic terms: A web server is a core aspect of a fullstack application, but ",(0,s.jsx)(t.strong,{children:"a\nweb server is not a core aspect of an application"}),". The same could be said about asset\noptimization, routing, and many other core fullstack JS concepts."]}),"\n",(0,s.jsxs)(t.p,{children:["flecks is concerned with ",(0,s.jsx)(t.strong,{children:"writing applications"}),"; fullstack applications are merely a subset of\nthat."]}),"\n",(0,s.jsx)(t.h2,{id:"do-one-thing-and-do-it-well",children:"Do one thing and do it well"}),"\n",(0,s.jsxs)(t.p,{children:["The core primitive is the ",(0,s.jsx)(t.strong,{children:"fleck"})," which is... just a JS module. There exists a server\nfleck, a web fleck, a React fleck, and so on."]}),"\n",(0,s.jsx)(t.p,{children:"Here's a simple fleck that says hello when the application is starting:"}),"\n",(0,s.jsx)(t.pre,{children:(0,s.jsx)(t.code,{className:"language-js",children:"export const hooks = {\n '@flecks/core.starting': () => {\n console.log('hey you');\n },\n};\n"})}),"\n",(0,s.jsxs)(t.p,{children:["That's it. It's a module that exports some hook implementations. If you're curious what kind of\nhooks we're talking about, check out\n",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/flecks/hooks",children:"the hooks reference page"}),"."]}),"\n",(0,s.jsxs)(t.p,{children:["You add a reference to your fleck to a file called\n",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/creating-a-fleck",children:(0,s.jsx)(t.code,{children:"flecks.yml"})})," and you're rolling. Again,\n",(0,s.jsx)(t.strong,{children:"a flecks application is just flecks"})," having their hook implementations invoked."]}),"\n",(0,s.jsxs)(t.p,{children:["What are multiple flecks called? ",(0,s.jsx)(t.strong,{children:"flecks"}),"!"]}),"\n",(0,s.jsx)(t.admonition,{title:"Wordplay",type:"tip",children:(0,s.jsxs)(t.p,{children:["It is not a coincidence that the name of the framework uses the same word as the plural form of\nits constituting elements: the implication is that ",(0,s.jsx)(t.strong,{children:"flecks is just flecks"}),", it's not doing\nanything special on its own. Sure, it ",(0,s.jsx)(t.em,{children:"does something"}),", but the something that it does is simply\norchestrate your flecks together into an application."]})}),"\n",(0,s.jsx)(t.h3,{id:"small-core",children:"Small core"}),"\n",(0,s.jsxs)(t.p,{children:["Creating an application with ",(0,s.jsx)(t.code,{children:"@flecks/create-app"})," and then doing\ne.g. ",(0,s.jsx)(t.code,{children:"yarn install --production"})," will result in a full working application with a size of\n",(0,s.jsx)(t.strong,{children:"less than 7 MB"}),". Granted, it's only a server that will start, have nothing to do, and halt in\nabout 100 ms, but it illustrates that flecks builds what you tell it to, ",(0,s.jsx)(t.strong,{children:"it is not a kitchen\nsink system"}),"."]}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"A screenshot of Fry from Futurama captioned "Not sure if you're overly specific or not specific enough"",src:n(1048).Z+"",width:"552",height:"414"}),"\n",(0,s.jsx)("figcaption",{style:{fontSize:"0.8rem"},children:(0,s.jsx)(t.em,{children:"When you're writing an article and curious about how the Big Kid on the Block performs in terms of raw default production application size, but can't even figure out how to measure it because you have already downloaded more than 7MB of ads for their \"hosting solution\" into your brain in the process"})})]})}),"\n",(0,s.jsx)(t.h3,{id:"the-flecks-way",children:"The flecks way"}),"\n",(0,s.jsx)(t.p,{children:"The few core architectural opinions that are held are presented as suggestions, not requirements."}),"\n",(0,s.jsxs)(t.admonition,{type:"info",children:[(0,s.jsx)(t.mdxAdmonitionTitle,{children:(0,s.jsx)(t.strong,{children:"\u201cI hold it to be the inalienable right of anybody to go to hell in his own way.\u201d"})}),(0,s.jsx)(t.p,{children:"\u2015 Robert Frost"})]}),"\n",(0,s.jsxs)(t.p,{children:["A few motivating philosophies which I ",(0,s.jsx)(t.strong,{children:"do not"})," consider to be suggestions regarding this\nproject:"]}),"\n",(0,s.jsxs)(t.ul,{children:["\n",(0,s.jsx)(t.li,{children:"You shouldn't be unpleasantly surprised by what happens"}),"\n",(0,s.jsxs)(t.li,{children:["Your application has what ",(0,s.jsx)(t.strong,{children:"you"})," want in it, not what ",(0,s.jsx)(t.strong,{children:"flecks"})," wants in it"]}),"\n",(0,s.jsx)(t.li,{children:"Developer comfort and confidence are essential, not just a nice-to-have"}),"\n",(0,s.jsx)(t.li,{children:"You shouldn't have to have a full budget for production deployment"}),"\n",(0,s.jsx)(t.li,{children:"Core architectural opinions require transparency and justification"}),"\n"]}),"\n",(0,s.jsx)(t.h2,{id:"why-though",children:"Why though?"}),"\n",(0,s.jsx)(t.p,{children:"You might be thinking something like:"}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"A screenshot of Michael from The Office shouting "NO GOD PLEASE NO"",src:n(9151).Z+"",width:"720",height:"405"}),"\n",(0,s.jsxs)("figcaption",{style:{fontSize:"0.8rem"},children:[(0,s.jsx)(t.em,{children:(0,s.jsx)(t.strong,{children:"Why?!"})})," ",(0,s.jsx)(t.em,{children:"A new JavaScript framework is the last thing we need."})]})]})}),"\n",(0,s.jsxs)(t.p,{children:["Perhaps you will write a thesis explaining in great detail why there is no\nobjective reason for flecks to exist. ",(0,s.jsx)(t.strong,{children:"I'm fine with that"}),",\n",(0,s.jsx)(d,{children:"because I love it and there's nothing you can do about it."})]}),"\n",(0,s.jsx)(t.p,{children:"Seriously though, a couple reasons why I made flecks and use it to develop applications are:"}),"\n",(0,s.jsx)(t.h3,{id:"separation-of-concerns",children:"Separation of concerns"}),"\n",(0,s.jsxs)(t.p,{children:["JS has matured a lot over the years, and modules are all but a first-class concept. This has been\na huge win for Properly Structured","\u2122\ufe0f"," applications."]}),"\n",(0,s.jsxs)(t.p,{children:["However, I believe the real reason many fullstack frameworks exist today is to\n",(0,s.jsx)(t.em,{children:"centralize concerns"}),". No one wants to set up a whole database, a routing system, a webserver,\netc, ",(0,s.jsxs)(d,{children:["etc, ",(0,s.jsx)(d,{children:"etc."})]})," every time. So, the default approach has been to reach out\nfor a framework to tie it all together. To some extent this is an inevitable evolution."]}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"Screenshot of Patrick Star with the caption "Push them somewhere else"",src:n(3948).Z+"",width:"478",height:"345"}),"\n",(0,s.jsx)("figcaption",{style:{fontSize:"0.8rem"},children:(0,s.jsxs)(t.em,{children:["You've never even ",(0,s.jsx)(t.strong,{children:"seen"})," a real ",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/redux",children:"duck"})]})})]})}),"\n",(0,s.jsxs)(t.p,{children:["With flecks, the first principle is to push these concerns out into modular units which do one\nthing and do it immaculately.\n",(0,s.jsx)(t.a,{href:"https://en.wikipedia.org/wiki/Unix_philosophy",children:"This is not a new concept"}),"! These units can be\ncomposed into an application that does as much or as little as you like, ",(0,s.jsxs)(d,{children:["without requiring\nyour application structure to follow some corporate diktat ",(0,s.jsxs)(d,{children:["requiring you to enter a mailing\naddress to submit a pull request. ",(0,s.jsx)(d,{children:"(don't ask...)"})]})]})]}),"\n",(0,s.jsx)(t.h3,{id:"joy",children:"Joy"}),"\n",(0,s.jsx)("div",{style:{float:"right",padding:"0 1.5rem"},children:(0,s.jsx)(t.img,{alt:"A screenshot of Marie Kondo stating "This one sparks joy."",src:n(8749).Z+"",width:"242",height:"242"})}),"\n",(0,s.jsxs)(t.p,{children:["I have found this structure to work very well and to ",(0,s.jsx)(t.em,{children:"feel pleasant"}),". It's great to get up and\nrunning super quickly without having to repeat a monolithic structure over and over. It's almost\nreminiscent of those small plastic building blocks my parents used to step on. Super fun!"]}),"\n",(0,s.jsxs)(t.p,{children:["I find that I ",(0,s.jsx)(t.strong,{children:"don't have to think about what flecks is doing"})," most of the time, which is exactly\nwhat I want."]}),"\n",(0,s.jsxs)(t.p,{children:["flecks is at its best when you can forget that it exists and everything Just Works","\u2122\ufe0f","."]}),"\n",(0,s.jsx)(t.h3,{id:"because-i-can",children:"Because I can"}),"\n",(0,s.jsx)(t.p,{children:"No, seriously! Over the years interacting with various parts of the JS ecosystem I have experienced\nall manner of closed-minded hostile encounters with people who regrettably lacked the imagination\nto understand something which may have ran counter to the established wisdom of the week."}),"\n",(0,s.jsxs)(t.p,{children:["So I guess anyone who told me that it won't work, doesn't make sense, or other copium-based\nresponses: Here it is! Eat your hearts out and haterz get meme'd on. ","\ud83d\udc85"]}),"\n",(0,s.jsx)(t.h2,{id:"thanks-again",children:"Thanks again"}),"\n",(0,s.jsxs)(t.p,{children:["I do appreciate you reading all that! Come send me love (or threats or whatever) at the\n",(0,s.jsx)(t.a,{href:"https://github.com/cha0s/flecks/discussions",children:"Github discussions page"}),"! ","\ud83d\ude0c"]})]})}function p(e={}){const{wrapper:t}={...(0,i.a)(),...e.components};return t?(0,s.jsx)(t,{...e,children:(0,s.jsx)(u,{...e})}):u(e)}},8749:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/kondo-8ca202a300547b698dedad3b3e1299e0.jpg"},3948:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/over-there-19c01e6cdf39cc325266aa184db093f0.jpg"},9151:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/pls-no-1cfa9e8bc25e1ee3d412e5c5ddbab291.jpg"},1048:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/specific-enough-7a5f7bca00d317ed79832a435f5bcedd.jpg"},3069:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/two-actually-12439fdd460029f7bf3d496e63e09b96.jpg"},6522:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/webscale-c13cfc37833381fdb967bdd730a5d584.jpg"},1151:(e,t,n)=>{n.d(t,{Z:()=>r,a:()=>a});var s=n(7294);const i={},o=s.createContext(i);function a(e){const t=s.useContext(o);return s.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}function r(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(i):e.components||i:a(e.components),s.createElement(o.Provider,{value:t},e.children)}}}]);
\ No newline at end of file
diff --git a/assets/js/89927158.73e04a13.js b/assets/js/89927158.73e04a13.js
deleted file mode 100644
index ce01cbca..00000000
--- a/assets/js/89927158.73e04a13.js
+++ /dev/null
@@ -1 +0,0 @@
-"use strict";(self.webpackChunkflecks_docusaurus=self.webpackChunkflecks_docusaurus||[]).push([[5563],{1620:(e,t,n)=>{n.r(t),n.d(t,{Tiny:()=>d,assets:()=>c,contentTitle:()=>r,default:()=>p,frontMatter:()=>a,metadata:()=>l,toc:()=>h});var s=n(5893),i=n(1151),o=n(9960);const a={title:"flecks: NOT a fullstack framework",description:"Introducing flecks: an exceptionally-extensible application production system.",slug:"introducing-flecks",authors:[{name:"cha0s",title:"Creator of flecks",url:"https://github.com/cha0s",image_url:"https://github.com/cha0s.png"}],tags:["announcement","introducing","flecks","release"],hide_table_of_contents:!1},r=void 0,l={permalink:"/flecks/blog/introducing-flecks",source:"@site/blog/2024-01-30-introducing-flecks.mdx",title:"flecks: NOT a fullstack framework",description:"Introducing flecks: an exceptionally-extensible application production system.",date:"2024-01-30T00:00:00.000Z",formattedDate:"January 30, 2024",tags:[{label:"announcement",permalink:"/flecks/blog/tags/announcement"},{label:"introducing",permalink:"/flecks/blog/tags/introducing"},{label:"flecks",permalink:"/flecks/blog/tags/flecks"},{label:"release",permalink:"/flecks/blog/tags/release"}],readingTime:6.405,hasTruncateMarker:!0,authors:[{name:"cha0s",title:"Creator of flecks",url:"https://github.com/cha0s",image_url:"https://github.com/cha0s.png",imageURL:"https://github.com/cha0s.png"}],frontMatter:{title:"flecks: NOT a fullstack framework",description:"Introducing flecks: an exceptionally-extensible application production system.",slug:"introducing-flecks",authors:[{name:"cha0s",title:"Creator of flecks",url:"https://github.com/cha0s",image_url:"https://github.com/cha0s.png",imageURL:"https://github.com/cha0s.png"}],tags:["announcement","introducing","flecks","release"],hide_table_of_contents:!1},unlisted:!1},c={authorsImageUrls:[void 0]},h=[{value:"First off, thanks for your time \ud83d\ude4f",id:"first-off-thanks-for-your-time-pray",level:2},{value:"Is it webscale fullstack?",id:"is-it-webscale-fullstack",level:2},{value:"For real, though",id:"for-real-though",level:3},{value:"Don't get it twisted",id:"dont-get-it-twisted",level:3},{value:"Do one thing and do it well",id:"do-one-thing-and-do-it-well",level:2},{value:"Small core",id:"small-core",level:3},{value:"The flecks way",id:"the-flecks-way",level:3},{value:"Why though?",id:"why-though",level:2},{value:"Separation of concerns",id:"separation-of-concerns",level:3},{value:"Joy",id:"joy",level:3},{value:"Because I can",id:"because-i-can",level:3},{value:"No TypeScript?",id:"no-typescript",level:2},{value:"Again, thanks for your time",id:"again-thanks-for-your-time",level:2}];function d({children:e}){const t={span:"span",...(0,i.a)()};return(0,s.jsx)(t.span,{style:{fontSize:"0.75em"},children:e})}function u(e){const t={a:"a",admonition:"admonition",code:"code",del:"del",em:"em",h2:"h2",h3:"h3",img:"img",li:"li",mdxAdmonitionTitle:"mdxAdmonitionTitle",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,i.a)(),...e.components};return(0,s.jsxs)(s.Fragment,{children:[(0,s.jsxs)(t.p,{children:["Introducing flecks: an ",(0,s.jsx)(t.strong,{children:"exceptionally-extensible application production system"}),"."]}),"\n","\n",(0,s.jsxs)(t.h2,{id:"first-off-thanks-for-your-time-pray",children:["First off, thanks for your time ","\ud83d\ude4f"]}),"\n",(0,s.jsxs)(t.p,{children:["I appreciate you checking out the project! I truly hope that you will find working with flecks\nto be a joy. Feedback is welcome over on the\n",(0,s.jsx)(t.a,{href:"https://github.com/cha0s/flecks/discussions",children:"Github discussions page"}),"!"]}),"\n",(0,s.jsx)(t.admonition,{title:'What\'s the letter before "alpha"?',type:"warning",children:(0,s.jsxs)(t.p,{children:["This is a new release and worked on by only one person: ",(0,s.jsx)(t.a,{href:"https://github.com/cha0s",children:"me"}),"! Please\nkeep this in mind!"]})}),"\n",(0,s.jsxs)(t.h2,{id:"is-it-webscale-fullstack",children:["Is it ",(0,s.jsx)(t.del,{children:"webscale"})," fullstack?"]}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"A screenshot from the 2010 "MongoDB is webscale" cartoon",src:n(6522).Z+"",width:"480",height:"360"}),"\n",(0,s.jsx)("figcaption",{style:{fontSize:"0.8rem"},children:(0,s.jsx)(t.em,{children:"yes, I remember"})})]})}),"\n",(0,s.jsxs)(t.p,{children:["I admit, I clickbaited with the title there just a little bit. I love fullstack! flecks is more\nthan capable of building fullstack applications. If you just want to jump to more of that sort\nof thing, you might be interested in the ",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/react",children:"React"}),"\npage in the documentation."]}),"\n",(0,s.jsx)(t.h3,{id:"for-real-though",children:"For real, though"}),"\n",(0,s.jsxs)(t.p,{children:["A fullstack JS application is basically appception: what you actually have is a server\napplication written in JS that serves a client application written in JS. Using\nthe same language obscures (arguably, ",(0,s.jsx)(t.em,{children:"by design"}),") the fact that these are actually two distinct\napplications."]}),"\n",(0,s.jsx)(t.p,{children:(0,s.jsx)(t.img,{alt:"A screenshot of Doctor Olivia Octopus saying "There's two, actually"",src:n(3069).Z+"",width:"790",height:"371"})}),"\n",(0,s.jsx)(t.admonition,{title:"Hot take",type:"danger",children:(0,s.jsxs)(t.p,{children:["Some modern framework APIs are becoming increasingly obscure in their attempt to paper over\nthis reality\n(",(0,s.jsx)(t.a,{href:"https://github.com/cha0s/flecks/blob/master/packages/react/src/client.js#L24",children:(0,s.jsx)(t.em,{children:"*ahem*"})}),"... and\ndon't get me started on ",(0,s.jsx)(t.a,{href:"https://www.mayank.co/blog/react-server-components/",children:(0,s.jsx)(t.strong,{children:"RSC"})}),"...)."]})}),"\n",(0,s.jsx)(t.h3,{id:"dont-get-it-twisted",children:"Don't get it twisted"}),"\n",(0,s.jsxs)(t.p,{children:["To put it in basic terms: A web server is a core aspect of a fullstack application, but ",(0,s.jsx)(t.strong,{children:"a\nweb server is not a core aspect of an application"}),". The same could be said about asset\noptimization, routing, and many other core fullstack JS concepts."]}),"\n",(0,s.jsxs)(t.p,{children:["flecks is concerned with ",(0,s.jsx)(t.strong,{children:"writing applications"}),"; fullstack applications are merely a subset of\nthat."]}),"\n",(0,s.jsx)(t.h2,{id:"do-one-thing-and-do-it-well",children:"Do one thing and do it well"}),"\n",(0,s.jsxs)(t.p,{children:["The core primitive is the ",(0,s.jsx)(t.strong,{children:"fleck"})," which is... just a JS module. There exists a server\nfleck, a web fleck, a React fleck, and so on."]}),"\n",(0,s.jsx)(t.p,{children:"Here's a simple fleck that says hello when the application is starting:"}),"\n",(0,s.jsx)(t.pre,{children:(0,s.jsx)(t.code,{className:"language-js",children:"export const hooks = {\n '@flecks/core.starting': () => {\n console.log('hey you');\n },\n};\n"})}),"\n",(0,s.jsxs)(t.p,{children:["That's it. It's a module that exports some hook implementations. If you're curious what kind of\nhooks we're talking about, check out\n",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/flecks/hooks",children:"the hooks reference page"}),"."]}),"\n",(0,s.jsxs)(t.p,{children:["You add a reference to your fleck to a file called\n",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/creating-a-fleck",children:(0,s.jsx)(t.code,{children:"flecks.yml"})})," and you're rolling. Again,\n",(0,s.jsx)(t.strong,{children:"a flecks application is just flecks"})," having their hook implementations invoked."]}),"\n",(0,s.jsxs)(t.p,{children:["What are multiple flecks called? ",(0,s.jsx)(t.strong,{children:"flecks"}),"!"]}),"\n",(0,s.jsx)(t.admonition,{title:"Wordplay",type:"tip",children:(0,s.jsxs)(t.p,{children:["It is not a coincidence that the name of the framework uses the same word as the plural form of\nits constituting elements: the implication is that ",(0,s.jsx)(t.strong,{children:"flecks is just flecks"}),", it's not doing\nanything special on its own. Sure, it ",(0,s.jsx)(t.em,{children:"does something"}),", but the something that it does is simply\norchestrate your flecks together into an application."]})}),"\n",(0,s.jsx)(t.h3,{id:"small-core",children:"Small core"}),"\n",(0,s.jsxs)(t.p,{children:["Creating an application with ",(0,s.jsx)(t.code,{children:"@flecks/create-app"})," and then doing\ne.g. ",(0,s.jsx)(t.code,{children:"yarn install --production"})," will result in a full working application with a size of\n",(0,s.jsx)(t.strong,{children:"less than 7 MB"}),". Granted, it's only a server that will start, have nothing to do, and halt in\nabout 100 ms, but it illustrates that flecks builds what you tell it to, ",(0,s.jsx)(t.strong,{children:"it is not a kitchen\nsink system"}),"."]}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"A screenshot of Fry from Futurama captioned "Not sure if you're overly specific or not specific enough"",src:n(1048).Z+"",width:"552",height:"414"}),"\n",(0,s.jsx)("figcaption",{style:{fontSize:"0.8rem"},children:(0,s.jsx)(t.em,{children:"When you're writing an article and curious about how the Big Kid on the Block performs in terms of raw default production application size, but can't even figure out how to measure it because you have already downloaded more than 7MB of ads for their \"hosting solution\" into your brain in the process"})})]})}),"\n",(0,s.jsx)(t.h3,{id:"the-flecks-way",children:"The flecks way"}),"\n",(0,s.jsx)(t.p,{children:"The few core architectural opinions that are held are presented as suggestions, not requirements."}),"\n",(0,s.jsxs)(t.admonition,{type:"info",children:[(0,s.jsx)(t.mdxAdmonitionTitle,{children:(0,s.jsx)(t.strong,{children:"\u201cI hold it to be the inalienable right of anybody to go to hell in his own way.\u201d"})}),(0,s.jsx)(t.p,{children:"\u2015 Robert Frost"})]}),"\n",(0,s.jsxs)(t.p,{children:["A few motivating philosophies which I ",(0,s.jsx)(t.strong,{children:"do not"})," consider to be suggestions when creating flecks:"]}),"\n",(0,s.jsxs)(t.ul,{children:["\n",(0,s.jsx)(t.li,{children:"You shouldn't be surprised by what happens"}),"\n",(0,s.jsxs)(t.li,{children:["Your application has what ",(0,s.jsx)(t.strong,{children:"you"})," want in it, not what ",(0,s.jsx)(t.strong,{children:"flecks"})," wants in it"]}),"\n",(0,s.jsx)(t.li,{children:"You shouldn't have to have a full budget for production deployment"}),"\n",(0,s.jsx)(t.li,{children:"Developer comfort and confidence are essential, not just a nice-to-have"}),"\n",(0,s.jsx)(t.li,{children:"Core architectural opinions require transparency and justification"}),"\n"]}),"\n",(0,s.jsx)(t.h2,{id:"why-though",children:"Why though?"}),"\n",(0,s.jsx)(t.p,{children:"You might be thinking something like:"}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"A screenshot of Michael from The Office shouting "NO GOD PLEASE NO"",src:n(9151).Z+"",width:"720",height:"405"}),"\n",(0,s.jsxs)("figcaption",{style:{fontSize:"0.8rem"},children:[(0,s.jsx)(t.em,{children:(0,s.jsx)(t.strong,{children:"Why?!"})})," ",(0,s.jsx)(t.em,{children:"A new JavaScript framework is the last thing we need."})]})]})}),"\n",(0,s.jsxs)(t.p,{children:["Perhaps you will write a thesis explaining in great detail why there is no\nobjective reason for flecks to exist. ",(0,s.jsx)(t.strong,{children:"I'm fine with that"}),",\n",(0,s.jsx)(d,{children:"because I love it and there's nothing you can do about it."})]}),"\n",(0,s.jsx)(t.p,{children:"Seriously though, a couple reasons why I made flecks and use it to develop applications are:"}),"\n",(0,s.jsx)(t.h3,{id:"separation-of-concerns",children:"Separation of concerns"}),"\n",(0,s.jsxs)(t.p,{children:["JS has matured a lot over the years, and modules are all but a first-class concept. This has been\na huge win for Properly Structured","\u2122\ufe0f"," applications."]}),"\n",(0,s.jsxs)(t.p,{children:["However, I believe the real reason many fullstack frameworks exist today is to\n",(0,s.jsx)(t.em,{children:"centralize concerns"}),". No one wants to set up a whole database, a routing system, a webserver,\netc, ",(0,s.jsxs)(d,{children:["etc, ",(0,s.jsx)(d,{children:"etc."})]})," every time. So, the default approach has been to reach out\nfor a framework to tie it all together. To some extent this is an inevitable evolution."]}),"\n",(0,s.jsx)("figure",{children:(0,s.jsxs)(t.p,{children:[(0,s.jsx)(t.img,{alt:"Screenshot of Patrick Star with the caption "Push them somewhere else"",src:n(3948).Z+"",width:"478",height:"345"}),"\n",(0,s.jsx)("figcaption",{style:{fontSize:"0.8rem"},children:(0,s.jsxs)(t.em,{children:["You've never even ",(0,s.jsx)(t.strong,{children:"seen"})," a real ",(0,s.jsx)(o.Z,{target:"_blank",to:"https://cha0s.github.io/flecks/docs/redux",children:"duck"})]})})]})}),"\n",(0,s.jsxs)(t.p,{children:["With flecks, the first principle is to push these concerns out into modular units which do one\nthing and do it immaculately.\n",(0,s.jsx)(t.a,{href:"https://en.wikipedia.org/wiki/Unix_philosophy",children:"This is not a new concept"}),"! These units can be\ncomposed into an application that does as much or as little as you like, ",(0,s.jsxs)(d,{children:["without requiring\nyour application structure to follow some corporate diktat ",(0,s.jsxs)(d,{children:["requiring you to enter a mailing\naddress to submit a pull request. ",(0,s.jsx)(d,{children:"(don't ask...)"})]})]})]}),"\n",(0,s.jsx)(t.h3,{id:"joy",children:"Joy"}),"\n",(0,s.jsx)("div",{style:{float:"right",padding:"0 1.5rem"},children:(0,s.jsx)(t.img,{alt:"A screenshot of Marie Kondo stating "This one sparks joy."",src:n(8749).Z+"",width:"242",height:"242"})}),"\n",(0,s.jsxs)(t.p,{children:["I have found this structure to work very well and to ",(0,s.jsx)(t.em,{children:"feel pleasant"}),". It's great to get up and\nrunning super quickly without having to repeat a monolithic structure over and over. It's almost\nreminiscent of those small plastic building blocks my parents used to step on. Super fun!"]}),"\n",(0,s.jsxs)(t.p,{children:["I find that I ",(0,s.jsx)(t.strong,{children:"don't have to think about what flecks is doing"})," most of the time, which is exactly\nwhat I want."]}),"\n",(0,s.jsxs)(t.p,{children:["flecks is at its best when you can forget that it exists and everything Just Works","\u2122\ufe0f","."]}),"\n",(0,s.jsx)(t.h3,{id:"because-i-can",children:"Because I can"}),"\n",(0,s.jsx)(t.p,{children:"No, seriously! Over the years interacting with various parts of the JS ecosystem I have experienced\nall manner of closed-minded hostile encounters with people who regrettably lacked the imagination\nto understand something which may have ran counter to the established wisdom of the week."}),"\n",(0,s.jsxs)(t.p,{children:["So I guess anyone who told me that it won't work, doesn't make sense, or other copium-based\nresponses: Here it is! Eat your hearts out and haterz get meme'd on. ","\ud83d\udc85"]}),"\n",(0,s.jsx)(t.h2,{id:"no-typescript",children:"No TypeScript?"}),"\n",(0,s.jsx)(t.p,{children:"I understand and appreciate the benefits of strong typing. I have also noticed that TS tends to sap\nmy joy when I work with it!"}),"\n",(0,s.jsx)(t.p,{children:"If you love flecks enough to be serious about working to improve it and you can also make a\ncompelling and transparent case to rewrite some or all of it in TS, I'm listening!"}),"\n",(0,s.jsx)(t.h2,{id:"again-thanks-for-your-time",children:"Again, thanks for your time"}),"\n",(0,s.jsxs)(t.p,{children:["I do appreciate you reading all that! Come send me love (or threats or whatever) at the\n",(0,s.jsx)(t.a,{href:"https://github.com/cha0s/flecks/discussions",children:"Github discussions page"}),"! ","\ud83d\ude0c"]})]})}function p(e={}){const{wrapper:t}={...(0,i.a)(),...e.components};return t?(0,s.jsx)(t,{...e,children:(0,s.jsx)(u,{...e})}):u(e)}},8749:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/kondo-8ca202a300547b698dedad3b3e1299e0.jpg"},3948:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/over-there-19c01e6cdf39cc325266aa184db093f0.jpg"},9151:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/pls-no-1cfa9e8bc25e1ee3d412e5c5ddbab291.jpg"},1048:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/specific-enough-7a5f7bca00d317ed79832a435f5bcedd.jpg"},3069:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/two-actually-12439fdd460029f7bf3d496e63e09b96.jpg"},6522:(e,t,n)=>{n.d(t,{Z:()=>s});const s=n.p+"assets/images/webscale-c13cfc37833381fdb967bdd730a5d584.jpg"},1151:(e,t,n)=>{n.d(t,{Z:()=>r,a:()=>a});var s=n(7294);const i={},o=s.createContext(i);function a(e){const t=s.useContext(o);return s.useMemo((function(){return"function"==typeof e?e(t):{...t,...e}}),[t,e])}function r(e){let t;return t=e.disableParentContext?"function"==typeof e.components?e.components(i):e.components||i:a(e.components),s.createElement(o.Provider,{value:t},e.children)}}}]);
\ No newline at end of file
diff --git a/assets/js/a0957561.19e04299.js b/assets/js/a0957561.3ae5c83f.js
similarity index 60%
rename from assets/js/a0957561.19e04299.js
rename to assets/js/a0957561.3ae5c83f.js
index fed220ab..4c6697a7 100644
--- a/assets/js/a0957561.19e04299.js
+++ b/assets/js/a0957561.3ae5c83f.js
@@ -1 +1 @@
-"use strict";(self.webpackChunkflecks_docusaurus=self.webpackChunkflecks_docusaurus||[]).push([[5048],{8536:e=>{e.exports=JSON.parse('{"blogPosts":[{"id":"introducing-flecks","metadata":{"permalink":"/flecks/blog/introducing-flecks","source":"@site/blog/2024-01-30-introducing-flecks.mdx","title":"flecks: NOT a fullstack framework","description":"Introducing flecks: an exceptionally-extensible application production system.","date":"2024-01-30T00:00:00.000Z","formattedDate":"January 30, 2024","tags":[{"label":"announcement","permalink":"/flecks/blog/tags/announcement"},{"label":"introducing","permalink":"/flecks/blog/tags/introducing"},{"label":"flecks","permalink":"/flecks/blog/tags/flecks"},{"label":"release","permalink":"/flecks/blog/tags/release"}],"readingTime":6.405,"hasTruncateMarker":true,"authors":[{"name":"cha0s","title":"Creator of flecks","url":"https://github.com/cha0s","image_url":"https://github.com/cha0s.png","imageURL":"https://github.com/cha0s.png"}],"frontMatter":{"title":"flecks: NOT a fullstack framework","description":"Introducing flecks: an exceptionally-extensible application production system.","slug":"introducing-flecks","authors":[{"name":"cha0s","title":"Creator of flecks","url":"https://github.com/cha0s","image_url":"https://github.com/cha0s.png","imageURL":"https://github.com/cha0s.png"}],"tags":["announcement","introducing","flecks","release"],"hide_table_of_contents":false},"unlisted":false},"content":"import Link from \'@docusaurus/Link\';\\n\\nexport function Tiny({children}) {\\n return {children};\\n}\\n\\nIntroducing flecks: an **exceptionally-extensible application production system**.\\n\\n{/* truncate */}\\n\\n## First off, thanks for your time :pray:\\n\\nI appreciate you checking out the project! I truly hope that you will find working with flecks\\nto be a joy. Feedback is welcome over on the\\n[Github discussions page](https://github.com/cha0s/flecks/discussions)!\\n\\n:::warning[What\'s the letter before \\"alpha\\"?]\\n\\nThis is a new release and worked on by only one person: [me](https://github.com/cha0s)! Please\\nkeep this in mind!\\n\\n:::\\n\\n## Is it ~~webscale~~ fullstack?\\n\\n\\n\\nI admit, I clickbaited with the title there just a little bit. I love fullstack! flecks is more\\nthan capable of building fullstack applications. If you just want to jump to more of that sort\\nof thing, you might be interested in the React\\npage in the documentation.\\n\\n### For real, though\\n\\nA fullstack JS application is basically appception: what you actually have is a server\\napplication written in JS that serves a client application written in JS. Using\\nthe same language obscures (arguably, *by design*) the fact that these are actually two distinct\\napplications.\\n\\n![A screenshot of Doctor Olivia Octopus saying \\"There\'s two, actually\\"](./two-actually.jpg)\\n\\n:::danger[Hot take]\\n\\nSome modern framework APIs are becoming increasingly obscure in their attempt to paper over\\nthis reality\\n([*\\\\*ahem\\\\**](https://github.com/cha0s/flecks/blob/master/packages/react/src/client.js#L24)... and\\ndon\'t get me started on [**RSC**](https://www.mayank.co/blog/react-server-components/)...).\\n\\n:::\\n\\n### Don\'t get it twisted\\n\\nTo put it in basic terms: A web server is a core aspect of a fullstack application, but **a\\nweb server is not a core aspect of an application**. The same could be said about asset\\noptimization, routing, and many other core fullstack JS concepts.\\n\\nflecks is concerned with **writing applications**; fullstack applications are merely a subset of\\nthat.\\n\\n## Do one thing and do it well\\n\\nThe core primitive is the **fleck** which is... just a JS module. There exists a server\\nfleck, a web fleck, a React fleck, and so on.\\n\\nHere\'s a simple fleck that says hello when the application is starting:\\n\\n```js\\nexport const hooks = {\\n \'@flecks/core.starting\': () => {\\n console.log(\'hey you\');\\n },\\n};\\n```\\n\\nThat\'s it. It\'s a module that exports some hook implementations. If you\'re curious what kind of\\nhooks we\'re talking about, check out\\nthe hooks reference page.\\n\\nYou add a reference to your fleck to a file called\\n`flecks.yml` and you\'re rolling. Again,\\n**a flecks application is just flecks** having their hook implementations invoked.\\n\\nWhat are multiple flecks called? **flecks**!\\n\\n:::tip[Wordplay]\\n\\nIt is not a coincidence that the name of the framework uses the same word as the plural form of\\nits constituting elements: the implication is that **flecks is just flecks**, it\'s not doing\\nanything special on its own. Sure, it *does something*, but the something that it does is simply\\norchestrate your flecks together into an application.\\n\\n:::\\n\\n### Small core\\n\\nCreating an application with `@flecks/create-app` and then doing\\ne.g. `yarn install --production` will result in a full working application with a size of\\n**less than 7 MB**. Granted, it\'s only a server that will start, have nothing to do, and halt in\\nabout 100 ms, but it illustrates that flecks builds what you tell it to, **it is not a kitchen\\nsink system**.\\n\\n\\n\\n\\n### The flecks way\\n\\nThe few core architectural opinions that are held are presented as suggestions, not requirements.\\n\\n:::info[**\u201cI hold it to be the inalienable right of anybody to go to hell in his own way.\u201d**]\\n\\n\u2015 Robert Frost\\n\\n:::\\n\\nA few motivating philosophies which I **do not** consider to be suggestions when creating flecks:\\n\\n- You shouldn\'t be surprised by what happens\\n- Your application has what **you** want in it, not what **flecks** wants in it\\n- You shouldn\'t have to have a full budget for production deployment\\n- Developer comfort and confidence are essential, not just a nice-to-have\\n- Core architectural opinions require transparency and justification\\n\\n## Why though?\\n\\nYou might be thinking something like:\\n\\n\\n\\nPerhaps you will write a thesis explaining in great detail why there is no\\nobjective reason for flecks to exist. **I\'m fine with that**,\\n
The few core architectural opinions that are held are presented as suggestions, not requirements.
― Robert Frost
A few motivating philosophies which I do not consider to be suggestions when creating flecks:
+A few motivating philosophies which I do not consider to be suggestions regarding this +project:
So I guess anyone who told me that it won't work, doesn't make sense, or other copium-based responses: Here it is! Eat your hearts out and haterz get meme'd on. 💅
-I understand and appreciate the benefits of strong typing. I have also noticed that TS tends to sap -my joy when I work with it!
-If you love flecks enough to be serious about working to improve it and you can also make a -compelling and transparent case to rewrite some or all of it in TS, I'm listening!
-I do appreciate you reading all that! Come send me love (or threats or whatever) at the Github discussions page! 😌
]]>The few core architectural opinions that are held are presented as suggestions, not requirements.
― Robert Frost
A few motivating philosophies which I do not consider to be suggestions when creating flecks:
+A few motivating philosophies which I do not consider to be suggestions regarding this +project:
So I guess anyone who told me that it won't work, doesn't make sense, or other copium-based responses: Here it is! Eat your hearts out and haterz get meme'd on. 💅
-I understand and appreciate the benefits of strong typing. I have also noticed that TS tends to sap -my joy when I work with it!
-If you love flecks enough to be serious about working to improve it and you can also make a -compelling and transparent case to rewrite some or all of it in TS, I'm listening!
-I do appreciate you reading all that! Come send me love (or threats or whatever) at the -Github discussions page! 😌