ST Portfolio

本リポジトリではTaiki Satoのポートフォリオのベースソースを管理しています。

Setup

Node.js　バージョン管理ツールをインストールする

下記などのツールをインストールします。

• https://github.com/nvm-sh/nvm?tab=readme-ov-file#install--update-script
• https://github.com/hokaccha/nodebrew?tab=readme-ov-file#install

Node.jsのバージョンを変更する

バージョン管理ツールインストール後、Node.jsのバージョン を.node-version指定の22.7.0に変更してください。

pnpmをinstallする

npm install -g pnpm

各種コマンド

依存インストール

pnpm install --frozen-lockfile

開発サーバー起動

pnpm dev

開発サーバー起動　サブディレクトリ指定

SUB_DIR=dir pnpm dev

コード整形

pnpm format

ビルド

pnpm build

ビルド　サブディレクトリ指定

SUB_DIR=dir pnpm build

更新方法

対象箇所	更新方法
ヘッダーリンク	/src/data/headerLinks.tsの内容を変更する
メニューリンク	/src/data/menus.tsの内容を変更する
フッターリンク	/src/data/footerLinks.tsの内容を変更する
SNSリンク(メニュー・フッター・私について > PROFILE)	/src/data/snsLinks.tsの内容を変更する
TOP 私について 画像	/src/data/parallaxGalleryItems.tsの内容を変更する
私について スライド画像	/src/data/slides.tsの内容を変更する
私について CAREER	/src/data/timelines.tsの内容を変更する
制作実績 FILTER	/src/data/filters.tsの内容を変更する

実績の更新について

実績の追加

/src/pages/works配下に拡張子astroでファイルを作成すること でページが追加されます。

一覧での表示設定

/src/data/works.tsの内容を更新することで設定できます。

  {
    slug: 'textile-manufacturer-site',
    title: '繊維メーカー',
    year: '2021',
    categories: ['PRIVATE WORKS'],
    tags: ['ART DIRECTION', 'WEB DESIGN'],
    image: '/detail/textile-manufacturer-site/sample.jpg', // 制作実績用画像
    mv: '/detail/textile-manufacturer-site/sample.jpg', // 詳細用画像
    mvSp: '/detail/textile-manufacturer-site/sample.jpg', // 詳細用画像(SP)
    isTop: true, // `true`の場合TOPページに表示
    imageTop: '/detail/textile-manufacturer-site/sample.jpg', // TOPページ表示用画像
  },