動かざることバグの如し

近づきたいよ 君の理想に

ArgoCDオレオレスタートコマンド

オレオレコマンドセット

「hogehoge」を任意のレポジトリ名に変更すること

k create ns hogehoge
k create secret generic my-secret --from-env-file=.env

argocd app create hogehoge --repo https://github.com/thr3a/kubernetes-manifests.git \
  --dest-namespace hogehoge \
  --dest-server https://kubernetes.default.svc \
  --path ./argo/hogehoge

argocd app set hogehoge --sync-policy automated --auto-prune --allow-empty

ArgoCDで自動反映(auto-sync)の間隔を変更する方法

環境

ArgoCDのsync遅すぎ問題

よく記事に「ArgoCDは自動でgitをsyncしてくれるので自動で反映してくれる」みたいなこと書いてあるけどデフォルトの設定ではやってくれない。

しかもauto-syncを有効にしてもデフォルトでは「3分ごと」にポーリングされる(??????) 公式ドキュメント

The controller will automatically detect the new config (fast tracked using a webhook, or polled every 3 minutes)

そこで自動反映の設定を変える設定メモ

ArgoCDのgit自動取得の間隔を変更

これはアプリごとではなくコントローラー自体に設定がある --app-resync 単位は秒なので好きに変更できる。デフォルトは3分なので180

apiVersion: apps/v1
kind: Deployment
metadata:
  name: argocd-server
spec:
  selector:
    matchLabels:
      app.kubernetes.io/name: argocd-server
  template:
    spec:
      containers:
      - command:
        - argocd-server
        - --app-resync 30
        name: argocd-server

ArgoCDの自動sync機能を有効にする

実はこれだけだと自動Syncしてくれない(デフォルトでOFFになっているため

この設定はレポジトリごとなので --sync-policy automated を設定する必要がある

argocd app set xxxxxxxxxxx --sync-policy automated

Webhookで反映を伝える方法

検証中

GitHub Actionsでgit差分がある時のみコミットする方法

環境

  • actions/checkout@v3

やりたいこと

GitHub ActionsでCI実行後にgit差分があればコミット&pushする。

なければそのまま終了する

どういうとき使うのかって言うと自動定期アップデートとか

コード

- name: Commit updated files
  run: |
    git config core.filemode false
    if ! git diff --exit-code --quiet
    then
      git add -A
      git config user.name thr3a
      git config user.email thr3a@example.com
      git commit -m "Commit updated files"
      git push
    fi

InferGetStaticPropsTypeを使ってnextjsをよりラクラクに

環境

  • nextjs 12.3

InferGetStaticPropsTypeってなに

getStaticPropsの返却値をもとにNextPageに渡されるPropsの型を推論してくれる機能

よくあるgetStaticPropsの例

例えばこんな感じにあったとして

import type { NextPage } from 'next';
import { GetStaticProps } from 'next';

type Repository = {
  id: number
  name: string
  full_name: string,
  description: string
  stargazers_count: number
} & Record<string, unknown>

type Props = { repos: Repository[] };

const Home: NextPage<Props> = ({repos}) => {
  return (
    <>
      { repos.map((repo) => {
        return (
          <p key={repo.id}>{repo.name} / {repo.description}</p>
        );
      })}
    </>
  );
};

export const getStaticProps: GetStaticProps<Props> = async (context) => {
  const res = await fetch('https://api.github.com/users/rails/repos');
  const repos: Repository[] = await res.json();
  return {
    props: {
      repos
    },
  };
};

export default Home;

ただ橋渡し用のPropsである、

type Props = { repos: Repository[] };

ってのが冗長だなと

そこでInferGetStaticPropsTypeを使ってみる 変更点は以下のみ

-type Props = { repos: Repository[] };
+type Props = InferGetStaticPropsType<typeof getStaticProps>;
 
-export const getStaticProps: GetStaticProps<Props> = async (context) => {
+export const getStaticProps = async (context: GetStaticPropsContext) => {

そうすると getStaticProps()は async (context: GetStaticPropsContext) だけのコードになるので 返却するProps変えるごとに橋渡し用のPropsも修正する必要がなくなった。便利

GetStaticPropsContextに置き換えたバージョンの全コード

import type { InferGetStaticPropsType, NextPage, GetStaticPropsContext } from 'next';

type Repository = {
  id: number
  name: string
  full_name: string,
  description: string
  stargazers_count: number
} & Record<string, unknown>

type Props = InferGetStaticPropsType<typeof getStaticProps>;

const Home: NextPage<Props> = ({repos}) => {
  return (
    <>
      { repos.map((repo) => {
        return (
          <p key={repo.id}>{repo.name} / {repo.description}</p>
        );
      })}
    </>
  );
};

export const getStaticProps = async (context: GetStaticPropsContext) => {
  const res = await fetch('https://api.github.com/users/rails/repos');
  const repos: Repository[] = await res.json();
  return {
    props: {
      repos
    },
  };
};

export default Home;

公式ドキュメントよこせ

Data Fetching: getStaticProps | Next.js

サーバーサイド版はないの?

あったわ

InferGetServerSidePropsType

公式のサンプルコードをよこせ

next.js/github.d.ts at canary · vercel/next.js

参考リンク