Matt's Roof Garden

Powered by 🌱Roam Garden

Archive/Delving into the wild world of Gatsby to create a Digital Garden

Status:: abandoned seedlings

Tags:: writing Gatsby Digital Garden learning in public Projects

> 🚧 This page is an experiment in learning in semi-public. Misc bits I learn about Gatsby will be recorded here on the way to creating an automated Digital Garden that pulls from Roam Research 🚧

Why am I doing this?

What needs to be added?

Correctly link tags → ~test and Theme Tester

Render TODO checkbox

Markdown Styling

highlighting

Headers h1 h2 h3

Add in classes to all components

add block uid to each div

Embedded blocks

versoning

For block refs use text of referenced block not block uid

Less Important

sliders

attributes

Blockquote rendering

Collapsable Parenthesis

Embeds

youtube

iframe

Bullet view styles

view as document

view as numbered list

Text Alignments

Page Embeds

What needs to be fixed?

Basic Aliases do not observe correct markdown format

the graph view causes the project to crash

External aliases should open in new tab

Block refs should show the actual text of the block

Block refs and block aliases incorrectly link to the uid with (( )) around them in the url

Errors


Failed to load resource: the server responded 
with a status of 404 (Not Found)
localhost:8000/page-data/404.html/page-data.json
404 page could not be found.



[Error] Error: missing: d4f76f04-a317-5387-8667-273590010ee9
    find (0.js:5760)
    initialize (0.js:5810)
    (anonymous function) (0.js:5841)
    initializeForce (0.js:6164)
    force (0.js:6206:106)
    GraphVisualisation (0.js:29557:224)
    renderWithHooks (commons.js:49523)
    mountIndeterminateComponent (commons.js:52202)
    callCallback (commons.js:34908)
    dispatchEvent
    invokeGuardedCallbackDev (commons.js:34957)
    invokeGuardedCallback (commons.js:35012)
    beginWork$1 (commons.js:57923)
    performUnitOfWork (commons.js:56877)
    workLoopSync (commons.js:56850)
    performSyncWorkOnRoot (commons.js:56476)
    performSyncWorkOnRoot
    (anonymous function) (commons.js:45809)
    unstable_runWithPriority (commons.js:74474)
    flushSyncCallbackQueueImpl (commons.js:45804)
    workLoop (commons.js:74418)
    flushWork (commons.js:74373)
    performWorkUntilDeadline (commons.js:73985)
[Error] The above error occurred in the <GraphVisualisation> component:
    in GraphVisualisation (created by ForwardRef(HotLoaderLazyWrapper))
    in AppContainer (created by ForwardRef(HotLoaderLazyWrapper))
    in ForwardRef(HotLoaderLazyWrapper) (at graph-button.js:39)
    in Suspense (at graph-button.js:38)
    in GraphButton (at header.js:21)
    in div (at header.js:19)
    in header (at header.js:15)
    in Header (at stacked-layout.js:21)
    in div (at stacked-layout.js:19)
    in Content (at stacked-layout.js:72)
    in NotesLayout (created by HotExportedNotesLayout)
    in AppContainer (created by HotExportedNotesLayout)
    in HotExportedNotesLayout (created by PageRenderer)
    in PageRenderer (at query-result-store.js:90)
    in PageQueryStore (at root.js:58)
    in RouteHandler (at root.js:80)
    in div (created by FocusHandlerImpl)
    in FocusHandlerImpl (created by Context.Consumer)
    in FocusHandler (created by RouterImpl)
    in RouterImpl (created by Context.Consumer)
    in Location (created by Context.Consumer)
    in Router (at root.js:75)
    in ScrollHandler (at root.js:71)
    in RouteUpdates (at root.js:70)
    in EnsureResources (at root.js:68)
    in LocationHandler (at root.js:126)
    in LocationProvider (created by Context.Consumer)
    in Location (at root.js:125)
    in Root (at root.js:133)
    in MDXProvider (at wrap-root-element.js:65)
    in MDXScopeProvider (at wrap-root-element.js:64)
    in Unknown
    in Unknown (at wrap-root-element.js:72)
    in StaticQueryStore (at root.js:150)
    in ConditionalFastRefreshOverlay (at root.js:149)
    in _default (at app.js:163)

React will try to recreate this component tree from scratch using the error boundary you provided, AppContainer.
    logCapturedError (commons.js:54247)
    logError (commons.js:54284)
    callback (commons.js:55464)
    callCallback (commons.js:47210)
    commitUpdateQueue (commons.js:47231)
    commitLifeCycles (commons.js:54578)
    commitLayoutEffects (commons.js:57523)
    callCallback (commons.js:34908)
    dispatchEvent
    invokeGuardedCallbackDev (commons.js:34957)
    invokeGuardedCallback (commons.js:35012)
    commitRootImpl (commons.js:57261)
    commitRootImpl
    unstable_runWithPriority (commons.js:74474)
    commitRoot (commons.js:57101)
    finishSyncRender (commons.js:56527)
    performSyncWorkOnRoot (commons.js:56513)
    performSyncWorkOnRoot
    (anonymous function) (commons.js:45809)
    unstable_runWithPriority (commons.js:74474)
    flushSyncCallbackQueueImpl (commons.js:45804)
    workLoop (commons.js:74418)
    flushWork (commons.js:74373)
    performWorkUntilDeadline (commons.js:73985)
[Error] Error: missing: d4f76f04-a317-5387-8667-273590010ee9 — link.js:11
    error (commons.js:66967)
    componentDidCatch (commons.js:69072)
    callback (commons.js:55469)
    callCallback (commons.js:47210)
    commitUpdateQueue (commons.js:47231)
    commitLifeCycles (commons.js:54578)
    commitLayoutEffects (commons.js:57523)
    callCallback (commons.js:34908)
    dispatchEvent
    invokeGuardedCallbackDev (commons.js:34957)
    invokeGuardedCallback (commons.js:35012)
    commitRootImpl (commons.js:57261)
    commitRootImpl
    unstable_runWithPriority (commons.js:74474)
    commitRoot (commons.js:57101)
    finishSyncRender (commons.js:56527)
    performSyncWorkOnRoot (commons.js:56513)
    performSyncWorkOnRoot
    (anonymous function) (commons.js:45809)
    unstable_runWithPriority (commons.js:74474)
    flushSyncCallbackQueueImpl (commons.js:45804)
    workLoop (commons.js:74418)
    flushWork (commons.js:74373)
    performWorkUntilDeadline (commons.js:73985)
[Error] Error: missing: d4f76f04-a317-5387-8667-273590010ee9
    componentDidCatch (commons.js:69079)
    callback (commons.js:55469)
    callCallback (commons.js:47210)
    commitUpdateQueue (commons.js:47231)
    commitLifeCycles (commons.js:54578)
    commitLayoutEffects (commons.js:57523)
    callCallback (commons.js:34908)
    dispatchEvent
    invokeGuardedCallbackDev (commons.js:34957)
    invokeGuardedCallback (commons.js:35012)
    commitRootImpl (commons.js:57261)
    commitRootImpl
    unstable_runWithPriority (commons.js:74474)
    commitRoot (commons.js:57101)
    finishSyncRender (commons.js:56527)
    performSyncWorkOnRoot (commons.js:56513)
    performSyncWorkOnRoot
    (anonymous function) (commons.js:45809)
    unstable_runWithPriority (commons.js:74474)
    flushSyncCallbackQueueImpl (commons.js:45804)
    workLoop (commons.js:74418)
    flushWork (commons.js:74373)
    performWorkUntilDeadline (commons.js:73985)
[Error] The above error occurred in the <AppContainer> component:
    in AppContainer (created by ForwardRef(HotLoaderLazyWrapper))
    in ForwardRef(HotLoaderLazyWrapper) (at graph-button.js:39)
    in Suspense (at graph-button.js:38)
    in GraphButton (at header.js:21)
    in div (at header.js:19)
    in header (at header.js:15)
    in Header (at stacked-layout.js:21)
    in div (at stacked-layout.js:19)
    in Content (at stacked-layout.js:72)
    in NotesLayout (created by HotExportedNotesLayout)
    in AppContainer (created by HotExportedNotesLayout)
    in HotExportedNotesLayout (created by PageRenderer)
    in PageRenderer (at query-result-store.js:90)
    in PageQueryStore (at root.js:58)
    in RouteHandler (at root.js:80)
    in div (created by FocusHandlerImpl)
    in FocusHandlerImpl (created by Context.Consumer)
    in FocusHandler (created by RouterImpl)
    in RouterImpl (created by Context.Consumer)
    in Location (created by Context.Consumer)
    in Router (at root.js:75)
    in ScrollHandler (at root.js:71)
    in RouteUpdates (at root.js:70)
    in EnsureResources (at root.js:68)
    in LocationHandler (at root.js:126)
    in LocationProvider (created by Context.Consumer)
    in Location (at root.js:125)
    in Root (at root.js:133)
    in MDXProvider (at wrap-root-element.js:65)
    in MDXScopeProvider (at wrap-root-element.js:64)
    in Unknown
    in Unknown (at wrap-root-element.js:72)
    in StaticQueryStore (at root.js:150)
    in ConditionalFastRefreshOverlay (at root.js:149)
    in _default (at app.js:163)

React will try to recreate this component tree from scratch using the error boundary you provided, AppContainer.
    logCapturedError (commons.js:54247)
    logError (commons.js:54284)
    callback (commons.js:55464)
    callCallback (commons.js:47210)
    commitUpdateQueue (commons.js:47231)
    commitLifeCycles (commons.js:54578)
    commitLayoutEffects (commons.js:57523)
    callCallback (commons.js:34908)
    dispatchEvent
    invokeGuardedCallbackDev (commons.js:34957)
    invokeGuardedCallback (commons.js:35012)
    commitRootImpl (commons.js:57261)
    commitRootImpl
    unstable_runWithPriority (commons.js:74474)
    commitRoot (commons.js:57101)
    finishSyncRender (commons.js:56527)
    performSyncWorkOnRoot (commons.js:56513)
    performSyncWorkOnRoot
    (anonymous function) (commons.js:45809)
    unstable_runWithPriority (commons.js:74474)
    flushSyncCallbackQueueImpl (commons.js:45804)
    workLoop (commons.js:74418)
    flushWork (commons.js:74373)
    performWorkUntilDeadline (commons.js:73985)

What needs to be themed?

Hide scrollbar

hide weird blue highlighting

Structure of the Gatsby project

mathieudutour/gatsby-starter-digital-garden is the top level site template which has as a dependency...

mathieudutour/gatsby-digital-garden pulls together the various

questions about gatsby

How do I create my own package?

how do I add a local package?

What are MDX components?

https://www.gatsbyjs.com/docs/mdx/importing-and-using-components/

What is a Remark Transformer Plugin?

https://www.gatsbyjs.com/tutorial/remark-plugin-tutorial/

how can a gatsby project be themed? Is it with CSS?

What needs to be themed?

Archive/Delving into the wild world of [[Gatsby]] to create a [[Digital Garden]]