Developer Blog

Tipps und Tricks für Entwickler und IT-Interessierte

Astro – Cookbook

by Ralph Astro

Installation

❯ npm create astro@latest
❯ npm create astro@latest --template with-tailwindcss
❯ npm add -D vite-plugin-static-copy
❯ npm add @shoelace-style/shoelace

Command Line / CLI

npm create astro@latest — –template basics
npm installInstalls dependencies
npm run devStarts local dev server at localhost:4321
npm run build Build your production site to ./dist/
npm run previewPreview your build locally, before deploying
npm run astro …Run CLI commands like astro add, astro check
npm run astro — –helpGet help using the Astro CLI

Add packages

❯ npx astro add tailwind

Frameworks – WebComponents

Shoelace

Lit

https://lit.dev/docs

Animation

Animate Image by MouseOver / Hover

CSS

.book {
    width: 300px;
    height: 480px;
    position: relative;
    transform-style: preserve-3d;
    transform: rotateY(-30deg);
    transition: 1s ease;
    animation: 1s ease 0s 1 initAnimation;
}

.book:hover {
    transform: rotateY(0deg);
}

page.astro

<div class="book">
    <Image
        src={"/cover-2.jpeg"}
        width={300}
        height={600}
        alt={book.title}
        format={"avif"}
    />
</div>

Daily: VS Code Error NSOSStatusErrorDomain

by Ralph Daily, Power Shell

If you got an NSOSStatusErrorDomain Error, when you start VS Code from the command line

❯ code
[0309/155203.303710:ERROR:codesign_util.cc(108)] SecCodeCheckValidity: Error Domain=NSOSStatusErrorDomain Code=-67062 "(null)" (-67062)

You should do this: codesign --force --deep --sign -

❯ which code
/Users/Shared/VSCode/Default/Visual Studio Code - Insiders.app/Contents/Resources/app/bin/code

❯ codesign --force --deep --sign - "/Users/Shared/VSCode/Default/Visual Studio Code - Insiders.app"
/Users/Shared/VSCode/ralphg/Visual Studio Code - Insiders.app: replacing existing signature

❯ code -v
1.88.0-insider
19ecb4b8337d0871f0a204853003a609d716b04e
x64