Baby steps with thi.ng ... am I doing this right?

[cristianvogel]

Its a big library with lots of challenging new ways of doing things, that I would like to learn.

So, just wondered if some kind of re-inforcement learning thread for humans could be an idea.

For example I am working in Svelte, and want to use @thi.ng more in the declarative way. But for now, I start with Colors.

so is this right?

I import what I need ( when I have found out what that is from the docs )* I don't understand how to import all Types that a collection needs automatically with npm.... For example, in Color, it took a while for me to find that I needed Type Vec from Vectors and I couldn't find ReadOnlyVec ...

 import type { CosGradientSpec } from "@thi.ng/color/api/gradients";
  import {
    cosineGradient,
    COSINE_GRADIENTS,
    css,
    transform,
    brightnessMat,
    type MaybeColor,
  } from "@thi.ng/color";
  import type { Vec } from "@thi.ng/vectors";
  ...
  ...
function assignNodeColorStates(
    nodeIndex: number,
    colorPick: MaybeColor | Vec
  ): void {
    let highlighted: Vec = [];
    $UI_Styles[nodeIndex].color = colorPick;
    transform(highlighted as Vec, brightnessMat(1.5), colorPick as Vec);
    $UI_Styles[nodeIndex].selectedColor = highlighted;
  }```

[postspectacular]

Firstly, I just posted this on my Mastodon (I think this is quite related to your question/issue):

https://mastodon.thi.ng/@toxi/111997356595048440

Second, can I ask why you think you need the vectors package for working with colors? Technically, the Color and ReadonlyColor types are identical to Vec and ReadonlyVec and are provided exactly to avoid having to also import the vectors package. If you found that in some example somewhere, then it's a mistake and I hope you remember where you've seen this...

umbrella/packages/color/src/api.ts

Lines 12 to 13 in 6e20f80

	export type Color = Vec;
	export type ReadonlyColor = ReadonlyVec;

The general problem with this larger project is that you're dealing here with 190 mostly separate libraries which cover a huge gamut of use cases & techniques. There're groups of related packages and there're a lot of different levels of abstration too, but there's no single or even just a small number of "easy routes in", so to speak... my answer is always: it depends.

The choice of using a single Github repo as home for almost 200 project is, because it's the practically the only way I can easily automate, refactor & project manage all these different projects. Yet, most people are so pre-conditioned that they equate 1 repo = 1 project and this difference is mostly getting completely lost in translation (and I'm not saying this applies to you here 😉). My inspiration for this setup was Google's humungous monorepo, described here: https://dl.acm.org/doi/pdf/10.1145/2854146

For the new thi.ng website I started working on a kind of "wizard" to propose a set of packages based on a funnel starting with a choice of use cases/fields of interest. Right now, the current thi.ng website has this huge tag cloud with over 500 tags/keywords extracted from the various packages and their meta data. You can click on a tag and it will show you a list of projects and hopefully helps to figure out which packages might be useful (also has a fuzzy search input): https://thi.ng/#tags

Another useful discovery tool (also mostly unknown) is actually also one of the example projects for https://thi.ng/rdom (which [in hindsight] is probably the closest thi.ng project to Svelte). This small tool is a keyword search of all embedded docs in all ~3900 source files (index is being updated with each release):

https://demo.thi.ng/umbrella/rdom-search-docs/

This tool too will become part of the new site...

I also highly recommend checking out some of the 30 #HowToThing mini-tutorials/examples. Again, these are not always aimed at total (thi.ng) beginners, but all are heavily commented.

For more actual tutorials, I've been working (not as much as I wished, but it's a process) on actual tutorials & course ware which I will likely offers as an online course of sorts. My current bias is towards a subscription-based newsletter format with in-depth articles about techniques, setup, project deconstructions & reconstructions, premade code examples, coding from scratch, best practices, diagrams, video segments, Q&A etc. Like the projects themselves, it will cover a whole range of topics (but also very much looking for suggestions)... Launch TBA (need to pre-prepare more materials first)

[postspectacular]

And @cristianvogel - to your question about getting all dependencies. Aside from (very rare) mistakes of accidentally omitting a required dependency in a package file, NPM/Yarn does download all transitive dependencies for each package (after all, that's its main task really :)...

[cristianvogel]

Thanks for the detailed response! I am beginning to understand, and hope to learn more in the following months