Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
リプレイスでやったこと
Search
K1mu21
November 15, 2024
Technology
1
35
リプレイスでやったこと
めぐろLT#21
K1mu21
November 15, 2024
Tweet
Share
More Decks by K1mu21
See All by K1mu21
Rust勉強会1回目の資料
k1mu21
0
27
ギャレトレ勉強会
k1mu21
0
13
Cloudflareいいぞ
k1mu21
1
76
静的解析ツールを導入した話
k1mu21
1
170
WebGLを触ってみよう
k1mu21
1
41
GoのAirを使ってみた話
k1mu21
0
76
学生から社会人1年目を通して
k1mu21
2
210
データベースで沼った話
k1mu21
0
56
Lidarであそぼ
k1mu21
0
40
Other Decks in Technology
See All in Technology
(機械学習システムでも) SLO から始める信頼性構築 - ゆる SRE#9 2025/02/21
daigo0927
0
150
なぜ私は自分が使わないサービスを作るのか? / Why would I create a service that I would not use?
aiandrox
0
760
Culture Deck
optfit
0
430
技術的負債解消の取り組みと専門チームのお話 #技術的負債_Findy
bengo4com
1
1.3k
現場で役立つAPIデザイン
nagix
34
12k
開発スピードは上がっている…品質はどうする? スピードと品質を両立させるためのプロダクト開発の進め方とは #DevSumi #DevSumiB / Agile And Quality
nihonbuson
2
3k
ソフトウェアエンジニアと仕事するときに知っておいたほうが良いこと / Key points for working with software engineers
pinkumohikan
0
100
Goで作って学ぶWebSocket
ryuichi1208
3
1.6k
全文検索+セマンティックランカー+LLMの自然文検索サ−ビスで得られた知見
segavvy
2
110
30分でわかる『アジャイルデータモデリング』
hanon52_
9
2.7k
リアルタイム分析データベースで実現する SQLベースのオブザーバビリティ
mikimatsumoto
0
1.4k
プロダクトエンジニア構想を立ち上げ、プロダクト志向な組織への成長を続けている話 / grow into a product-oriented organization
hiro_torii
1
220
Featured
See All Featured
Building Adaptive Systems
keathley
40
2.4k
The Pragmatic Product Professional
lauravandoore
32
6.4k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Distributed Sagas: A Protocol for Coordinating Microservices
caitiem20
330
21k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Thoughts on Productivity
jonyablonski
69
4.5k
Navigating Team Friction
lara
183
15k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
4 Signs Your Business is Dying
shpigford
182
22k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
251
21k
Building a Scalable Design System with Sketch
lauravandoore
461
33k
jQuery: Nuts, Bolts and Bling
dougneiner
63
7.6k
Transcript
リプレイスでやったこと めぐろLT#21
• 木村宗吾(K1mu21) ◦ 社会人2年目です!(高校からプログラミングしてました ) • 株式会社ラクーンホールディングス技術戦略部 • バックエンド(+フロントエンド+CI/CD…) ◦
業務ではJava,PHP ◦ 趣味ではGo • 趣味 ◦ ライブ ▪ ボカロのライブ行きました ◦ サウナ ▪ 錦糸町の黄金湯が最高です 😆 ◦ etc … • X ◦ @detunote
やったこと 2024年2月から8月まで弊社公式サイトのリニューアルプロジェクトを行った (関係ないがほぼ全く同じ期間で他のクソでかPJにも参加していた)
やったこと 1. Cloudflareでホスティングするようにした 2. CloudflarePagesFunctionのLogをCloudWatchに飛ばすようにした 3. パッケージ管理ツール(Renovate,Dependabot)を入れた 4. biomeの静的解析結果をCodeQuarityに出るようにした(githubではcode inspection?)
5. WordPressの記事,画像データをmicroCMSに移行した
Cloudflareでホスティングするようにした 元々社内サーバー内でTomcatを使ってホスティングをしていた 本来はデザインだけの改修予定だったが、↑の部分も回収しようという事になった 色々AWS、GCPなども考えたが、選んだのはCloudflare 無料枠が大きい、値段が安い、機能が要件的に十分だったことが決め手
CloudflarePagesFunctionのLogをCloudWatchに飛ばすようにした • CloudflarePagesFunctionはAWSでいうLambdaみたいなもの ◦ CloudflarePagesFunctionを使ってYoutubeAPIを叩いていたが、ログの保管ができない ◦ Cloudflare WorkersだとLogPushの機能を使ってS3とかNew Relicにログを送れるけど... •
監査的にログがないと起こられるので、以下のライブラリを使ってCloudWatchに送 信する仕組みにしてログの保管ができるようにしました https://github.com/aws/aws-sdk-js-v3/tree/main/clients/client-cloudwatch-log s • Cloudflareの話は別のLTで話してるので興味があったら見てみて下さい https://speakerdeck.com/k1mu21/cloudflareiizo
パッケージ管理ツールを導入 • ライブラリのアップデートを自動で管理してほしかったのでDependaBotを導入しまし た ◦ CIで回してるので人の手があまり入らないようになってます ◦ GitLabだとgroupsキーが使えなくてかなり微妙でした • MergeRequest(PR)をGitLabでもまとめることができるRenovateに入れ替えました
◦ 入れ替えるにあたった詳細は Zennで書いています ◦ https://zenn.dev/aeon_mall/articles/a62a1cf8652f01 ◦ https://zenn.dev/aeon_mall/articles/1704bebe048ef0
biomeの静的解析結果をGitLab CodeQuarityに出るようにした • biomeにはreporterという機能があり、これを使うと解析結果をJsonやxmlなどの形式 で出力することができます ◦ gitlabを指定すると静的解析結果を CodeQuarity形式で出力することができるようになります • これをArtifactとして持たせることで、MR上にCodeQuarityで表示することができる
ようにしました
WordPressの記事,画像データをmicroCMSに移行した • この作業が一番大変だった • WordPressをmicroCMSに移行することになったので過去データを移行する必要が 出てきた ◦ microCMS公式が出してるやり方だとアイキャッチ画像のみを引っ張ってくることができなかった ▪ アイキャッチが本文内にあり、
idなどでアイキャッチ画像の指定がされておらず特定が不可能 • https://blog.microcms.io/wordpress-to-microcms-tutorial-preparation • 新しくRestAPIのプラグインを入れることで情報は全て取得できたので解決 アイキャッチは記事の概要の上に来る画像のこと
メディア画像の取得 ・WPは/yyyy/mm/画像名の形式で保存されてるので月が変われば同じ画像名が使え る ・curl -oでファイルをダウンロードしていたが、↑の考慮をせずに画像名だけでダウンロー ドしてしまいファイルが上書きされてしまった ・解決した後にダウンロードファイル数が2ファイル足りなくて色々調査したが、全く同じ /yyyy/mm/画像名で形式で保存されていたのでまた上書きされていた
メディア画像のアップロード • マネジメントAPIを使ってアップロードを行いますが、ドキュメントがあるのでそこまで 難しくはないです • 1秒間に10ファイルしか送れないので1000ファイル以上アップロードしたのでかなり 時間が取られます • たまに500、429エラーが発生するのでリトライ処理をしないとかなり面倒くさいとい う罠があります
記事の取得 新しく入れたWPのプラグインを使うことで、APIを叩くことで必要な記事情報を取ってこ れるようになったので特に難しいことはないよ Advanced Custom Fieldsは許さん
記事のアップロード • microCMSにアップロードする際は勝手にmicroCMSの形式に変換して保存される のでWPの内容を変換する必要があった ◦ WP独自の形式で表示されてる部分もありキレてた https://microCMS形式/assets/一度きりの乱数/毎回生成される乱数/ファイル名 ファイル名x240-320.png→ファイル名png=240&w=320
まとめ • 新しいものにリプレイするのマジで大変 ◦ それぞれ基本的に互換性がないのでそれに合わせた設計とかを考えないといけない • 一から作り直すとマジで力がつく ◦ インフラ側とかの知識がすごいついた ◦
できなかったら代用できる方法がないかと気づける機会が増える • WordPressほんまカス ◦ microCMSに移行できるツールを OSS化したいなと思ってます ◦ カスコードなのでリファクタ必須