Skip to content

Instantly share code, notes, and snippets.

View julrich's full-sized avatar
🍋
squeezing!

Jonas Ulrich julrich

🍋
squeezing!
View GitHub Profile
@julrich
julrich / ruhmesmeile-startpage.yml
Last active May 9, 2021 20:24
ruhmesmeile Startseite als .md
Id: fd055920-b0fe-11eb-9ce8-bdbc5d8289d5
layout: default
heading: ruhmesmeile Startpage
content:
- mode: list
width: full
space-before: none
background: default
headline:
level: h2
@julrich
julrich / Query
Created May 16, 2021 21:38
kickstartDS GraphQL-API PoC
query MyQuery {
allKickstartDsPage {
edges {
node {
content {
content {
... on CountUpComponent {
topic
text
to
@julrich
julrich / README.md
Created September 25, 2021 18:15
Usage of `loadable()` for dynamic component resolution for pages

Description

exports.json files include maps to all published components, and for different modules (base, blog, content). This is used to look up the correct library folder and component name to resolve.

@julrich
julrich / createCompnentsMap.js
Created September 29, 2021 18:22
Create a component map from JSON mapping
const fs = require('fs')
const path = require('path');
const baseExports = require('@kickstartds/base/lib/exports.json');
const blogExports = require('@kickstartds/blog/lib/exports.json');
const contentExports = require('@kickstartds/content/lib/exports.json');
const reducer = (mod) => (prev, [key, value]) => {
if (key !== "index.js" && key.indexOf('/') === -1 && value.length) {
prev += `'${key}': loadable(() => import('@kickstartds/${mod}/lib/${key}/index.js'), { resolveComponent: (exports) => exports.${value[0]} }),\n`
}
@julrich
julrich / visual.schema.json
Created October 14, 2021 09:02
Demo Schema
{
"$schema": "http://json-schema.org/draft-07/schema#",
"$id": "http://frontend.ruhmesmeile.com/content/molecules/visual.schema.json",
"title": "Visual",
"description": "visual",
"type": "object",
"properties": {
"height": {
"title": "Height",
"type": "string",
renderingOptions:
submitButtonLabel: Absenden
type: Form
identifier: myForm
label: 'My Form'
prototypeName: standard
finishers:
-
options:
subject: Testemail
import "@kickstartds/core/lib/container-queries";
import { Component, define } from "@kickstartds/core/lib/core";
import { windowEvents } from "@kickstartds/core/lib/utils";
const desktopImageOffsetAngle = 60;
const mobileImageOffsetAngle = 75;
const mobileOffsetRotateAngle = 45;
const backgroundRotateFactor = -0.25;
const maxBlur = 4;
@julrich
julrich / output.json
Created February 26, 2022 15:36
Netlify Graph Response
{
"data": {
"spotify": {
"me": {
"savedTracks": {
"nodes": [
{
"name": "Such a good day",
"artists": [
{
@julrich
julrich / fallback.ks-tokens.json
Created March 10, 2022 21:07
Design Token Theme -> Tokens
{
"color": {
"primary": "#333",
"background": "#fff",
"foreground": "#000",
"link": "#1c7ed6"
},
"font": {
"display": {
"family": "Garamond, Baskerville, 'Baskerville Old Face', 'Hoefler Text', 'Times New Roman', serif",
@julrich
julrich / componentAnalytics.js
Created April 11, 2022 17:41
Rudimentary Component (props) Analytics in InfluxDB
const { InfluxDB, Point, HttpError } = require('@influxdata/influxdb-client');
const url = process.env['GATSBY_INFLUX_URL'] || 'http://localhost:8086';
const token = process.env['GATSBY_INFLUX_TOKEN'] || 'my-token';
const org = process.env['GATSBY_INFLUX_ORG'] || 'my-org';
const bucket = process.env['GATSBY_INFLUX_BUCKET'] || 'my-bucket';
const db = new InfluxDB({ url, token });
const isObject = (obj) =>