Shogo Oshima
Frontend developer
大島翔吾と申します。
フロントエンドデベロッパーです。
HTML / CSS / TypeScript が主軸。
フレームワークは Astro や Next.js、
CMS は WordPress をよく使います。
技術だけでなくデザインにも関心あり。
近頃は 3D とか WebGL に惹かれてます。
お問い合わせは Bluesky からどうぞ。

Timeline
2025
Created 28 commits in 3 repositories
Mar.
Published 14 posts
Mar.
View all posts in March
- Nullish coalescing operator の優先順位は低いため計算に使うときなどは注意が必要
- JavaScript でメディアクエリの状態変化を検知する
- JavaScript で URL のハッシュ部分を取得する
- Swup の updateHistoryRecord ヘルパー関数を使って URL を更新する
- JavaScript でローカルストレージに特定のキーを持つアイテムがあるかどうかを判定する
- ni を使って npm や yarn、pnpm、bun のコマンドを統一する
- Node.js の ES modules で __dirname や __filename を使う
- JavaScript で配列をシャッフルする
- Newt でカスタムオーダー順でデータを取得する
- Cloudflare Pages のビルド時にロックファイルとは異なるバージョンのパッケージが使われるときの対処法
- URL オブジェクトは文字列コンテキストにおいて href プロパティの値になる
- JavaScript で投稿の URL をコピーするボタンを実装する
- toggle() の force パラメーターを使って条件に合わせてクラス名をトグルする
- CSS で文字を長体(もしくは平体)にする
Created 243 commits in 8 repositories
Feb.
Published 42 posts
Feb.
View all posts in February
- JavaScript で大文字と小文字が混ざった文字列の配列をいい感じにソートする
- Newt で投稿にひもづいた参照フィールドの画像の情報などを取得する
- Newt で特定のフィールドの値を取得する
- giscus を使ってブログにコメント機能を追加する
- CSS を使ったクールなグラデーション集
- JavaScript で Object の中身をコンソールで確認する
- Astro で開発中のサイトをスマホで動作確認する
- JavaScript でローカルストレージを使ってユーザーが選択したモードなどを保存・取得する
- JavaScript でタッチデバイスかどうかを判定する
- JavaScript で特定の要素の中でマウスイベントが生じた位置を取得する
- JavaScript で エスケープキー(Esc)を押したときにモーダルを閉じる
- JavaScript の target と currentTarget の違い
- JavaScript で特定の要素が overflow しているかどうかをチェックする
- JavaScript で要素が特定の class を持っているかどうかをチェックする
- JavaScript で文字列の先頭のみを大文字にする(キャピタライズ)
- JavaScript で 数値を四捨五入する(Math.round)
- JavaScript の分割代入(destructuring assignment)で変数名をリネームする
- JavaScript の分割代入(destructuring assignment)でデフォルト値を設定する
- JavaScript で shorthand property names を使って console.log() を見やすくする
- JavaScript で shorthand property names を使ってオブジェクトのプロパティ名を省略する
- JavaScript でスプレッド構文を使ってオブジェクトを連結する
- JavaScript でスプレッド構文を使って配列を連結する
- Parameter と argument の違い
- JavaScript で偶数か奇数かを判定する
- rsync を使ってリモートサーバーからローカルにファイルを同期する
- pbcopy を使ってコマンドラインからクリップボードにコピーする(macOS)
- ダウンロードした zip ファイルを展開し、もとの zip ファイルは削除するスクリプト
- unzip コマンドで zip からファイルを取り出す
- 複数階層のディレクトリを mkdir する
- Vim でカーソル位置はそのままにスクリーンをスクロールする
- Homebrew Bundle を使って Brewfile でパッケージを管理する
- mas-cli を使って Homebrew 経由で App Store のアプリケーションを管理する
- Homebrew Cask を使って macOS 用のアプリケーションを管理する
- Astro で Tailwind CSS を使う
- Vite で Tailwind CSS を使う
- Vim でキーリマップする
- Vim でジャンプ前のカーソルに戻る
- Vim でファイル内の文字列を一括置換する
- JavaScript でスクロールバーの幅を取得して CSS カスタムプロパティとして設定する
Created 301 commits in 5 repositories
Jan.
Published 18 posts
Jan.
View all posts in January
- Next.js ルーティング関連の Pages Router と App Router の主な違い
- Next.js の useSearchParams を使ってクエリパラメータを更新する
- Next.js の usePathname で URL のパス名を読み取る
- Next.js の useRouter を使ってボタンクリック時などにページ遷移する
- 直前のコミットメッセージを修正する
- Obsidian で画像のサイズを指定する
- Finder でタブ補完を使ってパスを指定する
- Git エイリアスを使って Git コマンドをすばやく実行する
- コマンドエイリアスを使ってコマンドをすばやく実行する
- JavaScript でビューポート幅に応じて処理を分ける
- pnpm で特定のバージョンにパッケージをアップグレードする
- CSS でテキストの線をグラデーションにする
- CSS でテキストの塗りをグラデーションにする
- .gitignore に追記せずにローカル上でのみ特定のファイルを無視する
- VoiceOver を使ってウェブサイトの読み上げを確認する
- マークダウンでインラインコードにバックティックを表示する
このサイトをリニューアル
Jan. 23
Sylph というスターターをベースにこのサイトをリニューアル。
フレームワークは Next.js、コンテンツは MDX、 スタイリングは Tailwind CSS、アニメーションは Motion を使用。
2024
2,971 contributions
リニューアルプロジェクトで、ほんの少しだけフロントエンドを担当
Oct. 10
京進グループのリブランディングに伴い、グループサイト、中高受験、大学受験、個別指導、英会話など、一連のサイトリニューアルをキテレツが担当しました。5ブランド共有デザインシステムの構築、33,000ページ以上、編集者720名を有する CMS の開発、超大規模プロジェクトを無事リリースできました🎉 pic.twitter.com/07YaIId5YX
— 𝕂𝕚𝕥𝕖 / KITERETZ inc. (@ixkaito) October 10, 2024
WordPress 構築を担当
Jul. 4
B&H さん指揮のもと、Digital Garage さんのコーポレートサイト・IR サイトの WordPress 構築をキテレツが担当しました。ほぼすべてのコンテンツを管理画面上で更新できるようにしており、Digital Garage さんの担当者様には「管理画面が使いやすい!」とすごく喜んでいただいたのが印象的でした。 https://t.co/dyA36NBso6 pic.twitter.com/zeBP9KYMVX
— 𝕂𝕚𝕥𝕖 / KITERETZ inc. (@ixkaito) July 4, 2024
2023
憧れの KITERETZ inc. へ
Jun. 1
かねてより思いを馳せていた KITERETZ inc. で働き始める。
フロントエンドを中心に、 WordPress の構築なども担当。
React, Next.js との出会い
Jan. 1
転職するためには React と Next.js の知識が必要だと感じ、このサイトの前身を作成。
どちらも未知の世界だったが、とりあえずなにか作ってみることはとても学びになった。
そして、モダンな技術の素晴らしさにどんどん心惹かれてく。
2022
武器を磨くために転職を決意
Jan. 1
武器の候補には「写真」と「ウェブ制作」があったが、より極めたいと思ったのは後者だった。
その道を深く探求していくには、「スペシャリストが集まる会社に行くべきだ!」と転職を決意。
そのために必要な技術を集中的に学び始め、学べば学ぶほどに楽しくなっていく。
2021
できることが増え、武器がないことに焦る
打ち合わせ、デザイン、コーディングという受託制作の一連の流れを担う。
写真も好きだったので、サイトに掲載する写真や動画の撮影も担当。
色々とできるようになった反面、自分には武器と呼べるほどの強みがないことに気づく。
2019
社内のウェブ業務担当がいなくなる
諸事情により、主にウェブ関連の仕事を担当していた者が離脱。
そのため業務を諸々引き継ぐ必要があり、当時はバタバタしたが、自身にとってはよい経験となった。
2018
ウェブとの邂逅
グラフィック系の仕事もあったが、ウェブの仕事が増える。
学生のときにウェブ制作をかじっていたので、下層ページの作成などを任されるように。
このとき、かつて熱中していたウェブ制作の楽しさを思い出す。
グラフィックデザイナー見習いとして転職
Apr. 1
神戸元町にある会社に転職。
イベントで配るビラから始まり、名刺やインビテーション、カタログなどを作る。
昔に写真に力を入れていたこともあり、物撮りなども担当。
2017
グラフィックデザインに目覚める
学生時代にイラレなどを触っていたので、当時働いていたお店でフライヤー作成を依頼される。
その流れでポップやカフェのメニューを作ったりして、そのままグラフィックデザインにハマっていく。
2016
部屋中の窓を段ボールで閉ざす
暗室を作るために、自室の窓をすべて段ボールでふさぎ、壁一面を黒いマスキングテープで覆う。
ネットで情報をかき集め、フィルム現像からプリント、額装までを自分で行う。
2015
大学を中退
2年ほど休学した挙げ句、結局中退。写真が楽しく、大学に行く意味を見失う。
この辺りで、当時バイトをしていた本屋兼雑貨屋兼カフェで契約社員として働き始める。
2014
写真に取り憑かれる
この頃は写真にハマり、休日はもちろん、バイトの休憩中や行き帰りでも写真を撮り続ける。
食べることもおろそかになり、体重は40キロ台まで落ちる。
2013
卒業論文を提出して休学
卒業論文を提出したものの就職先もなく、「まだ学生でいた方がメリットがあるかも」と考え休学。
2012
はじめまして、WordPress
当時学生が立ち上げたウェブ制作系の会社にインターン的なノリで参加。
WordPress を使ったメディアサイトの立ち上げに関わる。
就活での運命の出会い
就活をしていく中でウェブ系の仕事の存在を知る。
ウェブ業界にキラキラしたものを感じ、HTML や CSS、ウェブデザインを独学し始める。
それがめちゃくちゃ楽しく、「これを仕事にするんや!」と決意。
2009
近畿大学経済学部に入学
2006
時給708円でキーボードをカタカタし始める
2000
ピアノをやめたくて少年野球チームに入る
1995
鍵盤を叩き始める
1990
大阪府羽曳野市で生まれる
Oct. 11