Blog

前回作ったdocker環境にVSCodeからデバックできるようにします。前回の記事を確認してください。nestjs + postgresql + devcontainerで環境を作る.vscode/launch.json{ "version": "0.2.0", "configurations": [ { "name": "Attatch to Node", "type": "node", "request": "attach", "address": "localhost",

nestjs+postgresql+devcontainerで環境を作りたいと思います。ディレクトリはこのような感じです。src は nestjs のコードが入っています。├── .devcontainer/│ └── devcontainer.json├── node_modules/├── src/├── .dockerignore├── docker-compose.yml├── Dockerfile└── package.jsondockerの準備まずは普通にdockerが動作するようにします。DockerfileARG NODE_VERFROM node:${NODE_VER}E

tailwindcssで画像無限スクロールを実装してみます。ホーム画面で実装しているようなやつです。'use client'import { useRef, useCallback } from 'react'import Image from '@/components/Image'const images = [ { src: '/images/back1.jpg', alt: '' }, { src: '/images/back2.jpg', alt: '' }, { src: '/images/back3.jpg', alt: '' }, { src: '/images/bac

スマホを縦横にするとwindow.innerWidthが正しく取得できなかったので、正しく取得できるようにしてみました。window.screenを利用して取得します。const widths = [window.innerWidth]if (window.screen?.width) { widths.push(window.screen?.width)}const width = Math.min(...widths)`

コンポーネントがたくさんcard:https://tailwindflex.com/

card:https://www.linustock.com/線画のイラストcard:https://www.ac-illust.com/イラスト動画見る必要あり

nextjsでsitemapを準備は以下のドキュメントを読めばすぐに実装ができます。card:https://nextjs.org/docs/app/api-reference/file-conventions/metadata/sitemapおすすめはtypescriptでの実装です。app/sitemap.tsimport type { MetadataRoute } from 'next'export default function sitemap(): MetadataRoute.Sitemap { return [ { url: 'https://acme.com

framer-motion というライブラリを利用して、ふわっと浮き出るテキストを実装していきます。このコードもしかしたら、どこかから拾ってきたやつかもしれないです…😓まずはインストールから$ npm install --save framer-motionコンポーネントimport { motion, MotionStyle } from 'framer-motion';export const Animation = ({ children, className, style, duration,}: { children: React.ReactNode; classNam

毎週ブログ書くって決めたのに、1ヶ月もサボってました…😓毎週更新するように努力します。dockerでpuppeteerを使えるようにします。まずはdockerfileの設定です。FROM node:18.17RUN apt-get update && apt-get install -y \ fonts-ipafont-gothic \ fonts-wqy-zenhei \ fonts-thai-tlwg \ fonts-kacst \ fonts-freefont-ttf \ libxss1 \ libgtk2.0-0 \ libnss3 \

dockerでminioを利用したいと思います。ほんとメモみたいなものなので、内容は適当です。dockerファイルの設定version: "3.7"services: minio: container_name: minio image: minio/minio:latest entrypoint: sh ports: 9000:9000 9001:9001 volumes: ./.minio-storage/:/storage environment: MINIO_ROOT_USER: ${AWS_ACCESS_K