SSH-keys

Generate an SSH key pair

https://docs.gitlab.com/user/ssh/#generate-an-ssh-key-pair

ssh-keygen -t ed25519 -C ""

Add an SSH key to your GitLab account

https://docs.gitlab.com/user/ssh/#add-an-ssh-key-to-your-gitlab-account

linux

xclip -sel clip < ~/.ssh/id_ed25519.pub

verify that you can connect

https://docs.gitlab.com/user/ssh/#verify-that-you-can-connect

instance url for ssh

ssh -T git@gitlab.com

Hvordan opprette og bruke

Github / Gitlab

Create SSH-keys & upload to Gitlab

Fint for å slippe å skrive inn brukernavn og passord hver eneste gang

1. ssh-keygen

Generating public/private rsa key pair.
Enter file in which to save the key (/home/paalss/.ssh/id_rsa):

2. [Enter]

...
Your public key has been saved in /home/paalss/.ssh/id_rsa.pub
...

3. cat /home/paalss/.ssh/id_rsa.pub

ssh-rsa <Hererenlanghashcode> paalss@Asus-VivoBook

4. Gå til SSH-siden:

• Github: Add new ssh keys
• Gitlab: SSH keys SSH keys 2

5. Lim inn ssh-rsa <Hererenlanghashcode>

Resten er rett frem

https://docs.oracle.com/en/cloud/cloud-at-customer/occ-get-started/generate-ssh-key-pair.html

Blir du spurt om username og password (PAT) ved git push?

Da bruker du sannsynligvis HTTPS:

Slik bytter du til SSH:

git remote set-url origin git@github.com:paalss/<repo>.git

Bitbucket

https://peter-whyte.com/setup-ssh-keys-in-wsl/

eval $(ssh-agent -s) && ssh-add ../pw_bitbucket

Personal Access Token for http https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token
Kan brukes til authentication i stedet for passord

https://docs.github.com/en/authentication/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent

eval "$(ssh-agent -s)"
ssh-add ~/.ssh/id_ed25519

eller:

ssh-add ~/.ssh/github_pw

scroll behavior in different css-positions

Discovery:

Set position: fixed|avsolute on parent element, and you can choose between instant and smooth scroll-behaviors (scroll-behavior: initial|smooth)

But with position: sticky|relative|static you can't choose. You're stuck with smooth scrolling

open explorer from terminal

WSL

explorer.exe .

Mac terminal

open .

install multiple versions of same dependency

npm i bootstrap-toc@npm:bootstrap@5.1.3 --save-exact

npm i bootstrap@5.2.3 --save-exact

usage

const bootstrap = require("bootstrap-toc/dist/js/bootstrap.bundle.min.js");
new bootstrap.ScrollSpy(document.body, {
  target: "#scroll-nav",
  // give space for header
  offset: 100,
});

HTML/JSX forskjeller

• class -> className
• for -> htmlFor
• how to set default value for <select>
• onchange -> onBlur
• <br>, <img>, <hr> -> <hr/> (all elements must have closing tag / be self closing)
• select default value

JSX

• Må ha ett root element
• ekstra setup nødvendig i VS Code: syntaxhighlihgting og emmet support: Må legge til en javascriptreact ting i en innstillingsfil. Emmet virker stort sett.

Delete all branches listed by `git branch -a`

Færre antall branches i code completion suggestion når du skriver git checkout feat-[Tab].

Slett alle branches som ikke finnes på remote:

git fetch -p

(git fetch prune)

Også, sørg for å slette unødvendige tags

List tags

git tag

git tag -d tagName

Use functions as children

Hvordan kan man lage et komponent som exposer en dataverdi som parent kan få tak i?

I.e. hvordan kan ChildComponent her gjøre dette lov?

          <ChildComponent>
            {({idFromChild}) => {
              return (
                <Button
                  href={`link/to/${idFromChild}`}
                >
					click here
                </Button>
              );
            }}
          </ChildComponent>

Slik:

export const ChildComponent = ({id}) => {
  return (
    <div>
      {children({
        id: id,
      })}
    </div>
  );
};

dispatcher is null

Prøv å npm linke react

1

DISPATCHER IS NULL ved app med og npm link library

First off: prøv

# i app
rm package-lock.json
rm -rf node_modules
npm i
# i library prosjektet
npm link ../../app/node_modules/react # <--- nødvendig
npm run build # <--- nødvendig
# i app
npm link @library/package
^C
npm run dev

Second: Toggle av og på det kommenterte nedenfor. Restart server mellom hver gang

// const path = require('path');

/** @type {import('next').NextConfig} */
const nextConfig = {
  // webpack: {
  //   alias: {
  //     react: path.resolve('./node_modules/react'),
  //   },
  // },
  async rewrites() {
    return [
      // Rewrite everything else to use `pages/index`
      {
        source: "/:path*",
        destination: "/",
      },
    ];
  },
};

module.exports = nextConfig;

Kan ikke brue react hooks i react component library? Får du dispatcher is null? Eller noe a la cannot use usestate of null?

Da er det sikkert noe multiple react-versjoner greier som er trøbbelet. Du kan fikse dette ved å legge til react og react-dom som peerDependencies i library's package.json

"peerDependencies": {
"bootstrap": ">=5.2.3",
"react": "$react",
    "react-dom": "$react"
},

Eller fjern package-lock.json, node_modules og reinstaller alle packages

Content editable

https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/contenteditable

In browser console:

document.body.contentEditable = true

why not multiple BrowserRouters

why not use multiple browserrouters

React Router error - 
    Error: You cannot render a <Router> inside another <Router>. You should never have more than one in your app.
    at Router (/vendors-node_modules_restart_hooks_esm_useForceUpdate_js-node_modules_restart_hooks_esm_usePr-cdac26.iframe.bundle.js:6709:103)
    at renderWithHooks (/vendors-node_modules_storybook_addon-a11y_dist_preview_mjs-node_modules_storybook_addon-essen-d391cf.iframe.bundle.js:38091:27)
    at mountIndeterminateComponent (/vendors-node_modules_storybook_addon-a11y_dist_preview_mjs-node_modules_storybook_addon-essen-d391cf.iframe.bundle.js:41855:13)
at beginWork (/vendors-node_modules_storybook_addon-a11y_dist_preview_mjs-node_modules_storybook_addon-essen-d391cf.iframe.bundle.js:43368:16)
    at beginWork$1 (/vendors-node_modules_storybook

Drew Reese - . There becomes an issue when you start nesting routers within routers, or rather it's the routing contexts within other routing contexts. The contexts of "outer" routers are unaware of what nested "inner" routers have handled.

https://stackoverflow.com/questions/67175039/is-it-possible-to-have-multiple-browserrouter-in-react-app

scriptedalchemy - Dont think you want have multiple browser routers. Youd want to use switch or something else. Only hosts should implement browser router, and only once. Usually I have a standalone wrapper that has like a mini shell for each app. Then I federate the inner component. So browser router stays on the shell layer

nebarf - Single source of truth: having a single "component" updating the browser history brings a lot of flexibility (e.g. it could really help in case you're gradually migrating a legacy system following the strangler pattern).

https://github.com/module-federation/module-federation-examples/issues/1986

update Python Conda environment

Lag et nytt conda environment med nyeste python versjon

Task warrior (CLI todo app)

Installer på Ubuntu (WSL)

sudo apt-get install taskwarrior

https://taskwarrior.org/download/

Oppstart

task version

yes for å lage config file (.taskrc)

Bruk

📍 Legg til task

task add bla bla bla bla

📌 - med priority

task priority:H add bla bla bla bla

📅📃 List opp alle tasks

task next

next kan sløyfes

✔ Gjennomfør task nr X

task X done

❌ 🗑 Slett

task X delete

https://taskwarrior.org/docs/30second/

💬🗨 Se og rediger alle detalljer

task X edit

🗃 Opprett i prosjekter

task add project:Kitchen Select floor tiles
task add project:Kitchen Measure counter-top
task add project:Kitchen Design placement of electrical outlets
task add project:Kitchen Locate ideal placement for extractor duct
task add project:Kitchen Select and order counter-top material
task add project:Kitchen Talk to the Electrician about when the work can start

https://taskwarrior.org/docs/best-practices/

Interessant

• Tools https://taskwarrior.org/tools/
• TUI
  • https://github.com/kdheepak/taskwarrior-tui
    • taskwarrior-tui-x86_64-unknown-linux-gnu.tar.gz - Best for Ubuntu/WSL
    • Se post om taskwarrior-tui: https://useful-snippets.netlify.app/posts/taskwarrior-tui/
  • visual interactive taskwarrior - https://gothenburgbitfactory.org/vit/
• GUI
  • https://github.com/DCsunset/taskwarrior-webui
  • https://github.com/theunraveler/taskwarrior-web