「AWS CDK Conference Japan」は AWS CDK ユーザーが集まって事例やノウハウを共有しあうイベントです。今回は、CDKv2をメインテーマに、初の大型カンファレンスが開催されました。アマゾンウェブサービスジャパンの大村氏は「Baseline Environment on AWS （BLEA）開発にあたって検討したこと」をテーマに発表しました。まずはCDKとBLEAについて解説したのち、これからCDKを使う方たちへのナレッジを紹介します 自己紹介 司会者：次は、今までがんばってCDK（Cloud Development Kit）を普及させてきた大村さんです。 大村幸敬氏（以下、大村）：よろしくお願いします。 司会者：初めて聞く単語なんですが、読み方は「ブレア」でいいですか？ 大村：「ブレア」でいいです。 司会者：準備ができたらBLEA（Baseline Environ
週末に自分がよく使っている技術をまとめたら反応が良かったので、テンプレートを作りました。 なにかWebサービスを作るときに、自分はこれらのライブラリを基本的には入れます。 ベースはcreate-next-appとなりますが、そこで生成された状態だと認証もDBも何もありません。 しかし、サービスを作るにあたって必要なケースがほとんどです。 このテンプレートには特定のライブラリを入れると毎回書かないといけない項目等を事前に作っておき、 開発に集中できる仕組みを作るのがゴールとなります。また、例を示しつつ削除するコード量を最小限に抑えます。 主にNext.js固有のハマるポイントや環境構築などめんどくさいけど毎回書いている点をカバーします。 linterと関連があるVSCode, pre-commit等の設定NextAuthに指定されたDB Schemaの作成やAPI routeの設置開発、テス
過激派が教える！ useEffectの正しい使い方
ReactのuseEffectは、フックの中でも使い方が難しいものの一つです。そこで、この記事では筆者が考えるuseEffectの望ましい使い方を皆さんに伝授します。 基本原則 技術やその要素の使い方を考えるにあたって、筆者が好んでいるのは基本原則を置いてそれに基づいて判断することです。ということで、この記事ではまず筆者が考えるReactの基本原則を紹介します。 筆者がもっとも重要視する原則は、ReactはUIライブラリであるということです。つまり、ReactにはUIの管理をさせるべきであって、その他のことはReactの役目ではないということです。Reactが難しいと思う人がいる場合、何でもかんでもReactにやらせようとするから余計に難しくなっているのだと思います。 例えばアプリケーションのロジックの管理やそれに付随するステートの管理はReactの役目ではないので、Reactの外部で処理
卒業証書 2021年4月にプログラミングスクールのWebデザイナー向けプログラミングコースを卒業しました。 受講していたのはRailsプログラマーコースだったのを、途中からメンターさんに相談してWebデザイナー向けにカリキュラム内容をカスタマイズしてもらって、受講してました。 受講していたスクールでははじめての試みだったということで、同じデザイナーの人でプログラミング勉強したいと考えている人向けに記事を残すことにしました。 プログラミングを勉強しようと思った経緯は以前投稿した記事に書いているので、そちらを参照してください。 ksmxxxxxx.hatenablog.com スクールでやったこと 通っていたのはフィヨルドブートキャンプというプログラミングスクールになります。 実際に進めたカリキュラムは以下になります。 Linuxの基本 Terminal Debianをインストール ファイル操
Google Apps Scriptの環境構築をVSCode上で行う方法について詳しく解説していきます。clasp,asideを使って構築するので、爆速で構築できます。 ことのはじまり 私は最近Google Apps Script(GAS)の学習を始めました。 GASの学習を始めると、まずはAppsScript公式のIDEでスクリプトを書いていくことになると思います。 しかし、普段VSCodeを使い慣れている身からすると、VSCodeの便利機能が使いたくて仕方なくなります。 それじゃあ、使い慣れたVSCodeを使おうじゃないか！！ AppsScript公式のIDEだとGitに差分を残していくこともできないぞ！！（できます） というわけで、GASをVSCodeを使って開発する為の環境構築の手順を書いていきたいと思います。 前提条件 VSCodeがインストールされている Node.jsがインス
セキュアにGoを書くための「ガードレール」を置こう - 安全なGoプロダクト開発に向けた持続可能なアプローチ - Flatt Security Blog
The Go gopher was designed by Renee French. (http://reneefrench.blogspot.com/) The design is licensed under the Creative Commons 3.0 Attributions license. 種々の linter が様々なプロダクトの品質を高めてきた、というのは疑う余地のない事実です。実装の初歩的な問題をエディタ内や CI/CD パイプライン中で機械的に検出できる環境を作れば、開発者はコーディングやコードレビューの邪魔になる些末な問題を早期に頭から追い出し、本質的な問題に集中できます。 また、そのような環境づくり（e.g. linter のルールセットの定義、組織独自のルールの作成、…）は、まさに開発組織のベースラインを定義する作業として捉えることができます。一度誰かが定義
めんどくさい作業にぶち当たった時、一気に改善してしまう人がいる。ガッと自動化したり仕組みそのものを変えたりしてしまうのだ。「めんどくさい」と心の中で思ったなら、その時スデに行動は終わっているのである。 たとえばコードレビューで都度同じ指摘をしだしたらLintとCIを整備したり、期限のリマインドを何度もしていたらリマインドそのものを自動化したり。CI/CDやBranch Protect Ruleを初期段階で整えるみたいな動きもそう。 こういう動きができる人とできない人の違いは、大きく次の4つの段階に分けられる。 1. めんどくさいと自覚できるか 1つめはスタンスの問題かもしれない。「もっとよくできないか？」「なぜこれをやってるんだっけ？」といった感じで今の運用を疑ってみるのが第一歩である。 よい状態を知っている方が当然自覚しやすいので、次の2とも密接に関係してくる。 2. めんどくさくない状
Dockerfile自信持って書けてますか？おすすめlintツール 「hadolint」について紹介 - Qiita
はじめに Dockerfile、サッと書こうと思ったのに、書き始めたら意外と時間かかったりしますよね。 突き詰めるとすごく奥が深いなと思います。 公式のドキュメントでも、Dockerfileのベスト・プラクティスという形で公開してくれていますが、 これを毎回意識するのは大変です。 また、意識できていたとしても、複数人で管理していると、各個人のスキルレベルによって差が出てしまいます。 そんなときにおすすめのツールを見つけたので紹介します。 hadolintというツールです。 Haskell Dockerfile Linterの略だそうで、Dockerfileの静的解析を行ってくれるlintツールです。 hadolintを使うとこんな利点があります。 build前にシンタックスエラーなどに気付ける (地味にトライアンドエラーしてると時間食うんですよね...) 自然とベストプラクティスに則ったD
前に書いた ESLint と Prettier の共存設定とその根拠について が公式推奨が変わったことにより一部間違った情報になっているのでその訂正記事です。 該当記事に書いた内容は Prettier と ESLint の関係を読み解く上で役立つ情報だと思うので、警告とこのページへのリンクを書いた上でそのまま残しておきます。 (追記) この記事の内容も間違った内容を書いていました。なので一度大幅な訂正をしています。prettier-eslint も推奨ではありません。 変更点の要約 Prettier と ESLint の組み合わせについて公式 の推奨方法が変わりました。 きっといつかこの情報も古くなるので直リンクではなく、ドキュメントの GitHub のリンクを貼っておきます。 ドキュメント自体のリンクはこちらです。 新しいドキュメントを要約すると、 Linter と Formatter
VS Codeをなぜ、使い続けているのか？
前書き この記事を読んでいるエンジニアの皆さんは、それぞれ異なるエディタを使用しているかと思います。読者自身が使用しているエディタの良し悪しについては詳しいと考えているため、私がVS Codeと他のエディタを比較をすることは、限界があります。また、VS Code と他のエディタの機能や快適さを比較できません。 そこで、私が毎日使用している VS Code の良さをアピールすることで、VS Code を使ってもらう機会を作りたいと思っています。 ここで説明しないこと カスタマイズしたキーコンフィグの紹介 ただし、これから紹介する VS Code の機能に好みのキーコンフィグを割り当てることは可能です。 他のエディタとの比較(Vim系 JetBrain系 Helix等の新興エディタ系) 目次 VS Codeとは 毎月のアップデート VS Codeのデフォルト機能 拡張機能（エクステンション）が
Modern Web Development on the JAMstack を読んでまとめた - console.lealog();
https://www.netlify.com/pdf/oreilly-modern-web-development-on-the-jamstack.pdf Netlify社が2019年に公開した本？PDFです。 せっかくJamstackの会社に入ったので、読んでおかないといけない気がして。 あとJamstackは人によって解釈が違ったりするとし、Jamstackの真髄について知っておきたいですよね？と思い。 ただこれなんと127ページもあるんですよね〜。 全編もちろん英語なので、読むのも中々に大変ですよね〜。 てなわけで、ざっくり訳してまとめまておきました。（それでも長いけど） はじめに ここ最近のWebの進化はすさまじい ブラウザもJavaScriptもパワフルになった その分ユーザーの要求も増える やることが増えると処理は遅くなる 遅いページは見向きもされないモバイル当たり前の世界だ
フロントエンド初心者が無事に Hugo のブログを Gatsby で一から作り直すことができた。その振り返り。 歴史 インターネットを小中学生(もはや 25 年以上前)に触り初めた頃に、HTML で文章の構造を作り CSS でデザインする、ということができるのを知って感動したけど、結局自分には何かが合わなくてそれを突き詰めることができなかった。というか、それを知ったが故にテーブルレイアウトとかがどうしても気に入らず、かといって CSS は float が難しすぎて、結局ウェブサイトを作る、という根本的な営みをずっと避けてきてしまった。 時は過ぎ、Wordpress の様なブログエンジンや Hugo の様な仕組みがあったおかげでブログを初めて続けることはできた。13 年前にレンタルサーバに Wordpress を置いて始めたこのブログも 9 年前には VPS での Wordpress 運用に
はじめに 少し前から話題になっているが、日本の労働生産性はG7で最も低いらしい。 日本生産性本部資料より https://www.jpc-net.jp/intl_comparison/intl_comparison_2018_press.pdf 日本は人口減少に突入していることもあって、「作業の効率化」や「自動化・省力化」をいうフレーズをあらゆる業種で聞くようになった。 ITエンジニアは、あらゆる職業の中でも最も効率化、自動化をして生産性を高められるといっても過言ではないだろう。プログラマの三大美徳(「怠惰」「短気」「傲慢」)にもあるように、同じことを何度もやらない、楽をするためにがんばるという生産性を意識した感性が重要視されているからだ。 生産性を高めることで、勉強する時間が作れたり、新しいことを経験したりするなどしてさらにスキルアップができ、さらに生産性が上がるという好循環を作り出すこ
私が愛するフロントエンドのツールたち2023
自分がチームでフロントエンドの開発をするときの技術選定について書きます。 ログインしてユーザーごとに個別の情報を扱うことがメインのサービスを前提に書きます。 考え方 メンテナンス性の優れたものを選ぶ 制限が少ないものを選ぶ 余計なことに気を使わない 一気にいろんなことに挑戦しすぎない フレームワーク 正直に書くと最近は問答無用でNext.jsを選択しています。 慎重な性格なので、自分が責任を持って開発、運用するプロダクトであれば自分の経験値が高く、多くの課題をクリアできるNext.jsを選びます。 一部インフラの制約があるものの、ページごとにSSGやSSR、On-demand ISRなどができること、Reactの大きなエコシステムの恩恵を受けられることは非常に大きいです。 採用面でも現状Reactを扱える人は他のフレームワークを扱える人より多く感じます。 次点でCloudflare Wor
はじめに Reactを中心としたフロントエンド開発において、以下のような構成を見かけることが多いと思います。 UIライブラリとしてReact 型のある言語としてTypeScript スタイル定義としてstyled-components コンポーネントの開発環境としてStorybook LinterとしてESLint FormatterとしてPrettier この記事では、各種ライブラリについて紹介したのち、それらを使う場合の環境構築についてハンズオン形式で説明します。 ※ アプリケーションを開発する際に必要になる設定が抜けていたので、追記しました。 各種ライブラリの紹介 まず、各ライブラリがどのようなものなのかを簡単に紹介します。 ライブラリの使い方などは公式ドキュメントなどを参照するようにしてください。 ドキュメント ReactはUI(ボタンやフォームなど)コンポーネントを作成するための
Latest topics > GitHubに多数ある自分のリポジトリのデフォルトブランチをmasterからtrunkに切り替えた - outsider reflex
Latest topics > GitHubに多数ある自分のリポジトリのデフォルトブランチをmasterからtrunkに切り替えた 宣伝。日経LinuxにてLinuxの基礎？を紹介する漫画「シス管系女子」を連載させていただいています。 以下の特設サイトにて、単行本まんがでわかるLinux シス管系女子の試し読みが可能！ « ポジショントークに騙されないようにしたいし、狭い視野でポジショントークじみた極論を言うよりも、メリットとデメリット両方を把握した上でソフトランディングを図っていきたい Main Chromiumのコミットメッセージの「よりinclusiveにする」とはどういう意味か、GitHubがしている事の何がキナ臭いのか » GitHubに多数ある自分のリポジトリのデフォルトブランチをmasterからtrunkに切り替えた - Jun 12, 2020 Gitのデフォルトブランチ名
RustでWebアプリケーションのバックエンドを開発するには ─ 型システムの堅牢性と柔軟性を業務システムにも！｜ハイクラス転職・求人情報サイト AMBI（アンビ）
ハイクラス求人TOPIT記事一覧RustでWebアプリケーションのバックエンドを開発するには ─ 型システムの堅牢性と柔軟性を業務システムにも！ RustでWebアプリケーションのバックエンドを開発するには ─ 型システムの堅牢性と柔軟性を業務システムにも！ 安全性に大きな特徴があるプログラミング言語Rustは、C言語やC++に代わるシステム記述言語として注目されてきました。しかし、その安全性とパフォーマンスの高さにより、ビジネスアプリケーションの構築にも採用されています。この記事ではキャディ株式会社による事例を紹介します。 こんにちは。キャディ株式会社バックエンドエンジニアの松田と申します。 キャディ株式会社では、「モノづくり産業のポテンシャルを解放する」をミッションとして、製造業分野に関連するさまざまなソフトウェアの開発を行っています。また、そのための主要な開発言語としてRustを採用
2020年秋にVue.jsのアプリケーションを作るなら、押さえておきたい5つのポイント | フューチャー技術ブログ
TIGの伊藤真彦です。 ここ最近はVue.jsでのフロントエンド開発を行っています。 ほぼ何もない状態からのスタート段階から始めたのですが、その際調査したことが学びになったので共有します。 ※この記事は 2020/10/13 に執筆されました。調査日は2020/08/17～2020/09/01 のため、バージョンなど当時と状況が異なるものがあります。この1ヶ月の間でも、alphaからbetaに変わったり、betaが取れたりと進化が速いです。 公式ライブラリのステータスはこちらもご参考ください。 https://v3.vuejs.org/guide/migration/introduction.html#supporting-libraries 前提として押さえておきたい2点のポイント環境構築はVue CLIフューチャーでは仕事ですぐに使えるTypeScriptと題しまして、TypeScri
この本の概要 Go言語ユーザーとして，「もう一段レベルアップしたい」「開発に使いたい」と思っている方に向けた，Go言語の解説本です。関数やパッケージの使い方，並行処理，テストといった基本的なトピックにおいて，「こう書くと綺麗になる」「こう書くとパフォーマンスが上がる」といったエッセンスを紹介します。後半ではCLIアプリ／Webアプリの開発手順や，現場で使われている便利なパッケージなど，著者が業務やOSSの開発で培った技術をふんだんに紹介します。 こんな方におすすめ Go言語の入門を終え，さらに深く学びたい人 第1章 プログラミング言語Goとは 1.1 Goの簡単な歴史 1.2 Goの立ち位置 1.3 Goが利用される場面 標準でUTF-8をサポート マルチプラットフォーム 並行処理の扱いやすさ ストリーム指向 シングルバイナリ 1.4 教育用途としてのGo 1.5 なぜGoが使われるのか
2024年のCSSの書き方、ワークフローとツールについて
CSSには大きく変わるタイミングが何度かありました。レスポンシブ対応、メディアクエリ、Flexbox、CSS Gridなどはその大きく変わったタイミングでしょう。 そして、2024年もこれらと同様に大きく変わりそうです。CSSのネスト、:has()疑似クラス、subgrid、コンテナクエリ、ビューポート単位などの新機能がすべてのブラウザにサポートされました。 2024年のCSSの書き方として、より保守しやすいCSS、ワークフロー、ツールについて紹介します。 How I'm Writing CSS in 2024 by Lee Robinson 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに デザインの制約 2024年のCSS お勧めのCSSツール 終わりに はじめに 2024年のCSSは、素晴らしいの一言に尽きます。
こんにちは Misoca 開発チームの id:mallowlabs です。最近は ドラえもん のび太の牧場物語 にハマっています。使っている道具のグレードを上げるために、牧場はそっちのけで鉱山にこもって鉱石を掘り出す毎日です。 さて、先日の 軽減税率・区分記載請求書対応のリリース は開発チームにとっても比較的大きなリリースでした。そのため、リリースの直前には、このリリースに関係しないコミットは master ブランチにマージを控えることになり*1、自然と開発メンバーが普段使っているツールの整備や自由研究が行われることになりました。 ふりかえりで、このいわゆる「斧を研ぐ時間」がよかったという声が複数出たため、この時間を狙って作ってみようという TRY が生まれて「エンジニアリングフライデー」という試みが生まれました。 今回はこのエンジニアリングフライデーについて紹介したいと思います。 エンジ
Testing JavaScript をやってみたら学びがあって良かった話 - Adwaysエンジニアブログ
こんにちは。リファクタリングが大好きなフロントエンドおじさん梅津です。 自信を持ってリファクタリングするには信頼できる自動テストが必要ですよね。 じゃあ信頼できる自動テストとはなんだろう？どう書いたらいいんだろう？と考えていました。 とくにコンポーネントを含む UI テストに対しての悩みが強かったです。 そんなときに出会ったのが Testing JavaScript です。 この記事ではその Testing JavaScript の紹介をしたいと思います。 Testing JavaScript とは Testing JavaScript は PayPal のエンジニアである Kent C. Dodds によって作成された教材です。 ページを開いてすぐ目に飛び込んでくるテスティングトロフィーが特徴的ですね。 Testing JavaScript では、ここに記されている Static, Un
かれこれ 5 年くらい趣味開発で npm-scripts を書き続けている。長年書き続けているとノウハウが蓄積されてきて、「こう書くとスッキリする」「迷いがなくなる」「後から拡張したくなった時に、簡単に拡張できる」みたいな書き方が身についてきた。自分の型、あるいは手癖のようなものだと思う。 せっかくなので、id:mizdra の今の npm-scripts を書く時の手癖を書き連ねてみる。 基本形 { "scripts": { "build": "webpack --mode production", "dev": "webpack-dev-server --mode development", "lint": "eslint .", "test": "jest" } } 一番シンプルな npm-scripts を書く時のパターン。以下の 4 つの script を登録している。 buil
分業化するWeb開発からフルスタックなIoTシステムへ ─ 育てたスキルは次のキャリアへ地続きに広がっていく - Findy Engineer Lab
こんにちは、はじめまして。株式会社ソラコムでIoTエンジニアとして働いている@moznionと申します。主に、IoTプラットフォームの開発・運用に従事しています。 このたび「わたしの選択」というテーマで寄稿の機会をいただいたので、かつてレイヤ7（アプリケーション層）で動作するソフトウェアを書いて日々を過ごしていた人間が、いかにしてIoTというIT技術の総合格闘技のフィールドへ身を投じるに至ったかをお話ししたいと思います。 IoTエンジニアをやっていると、よく「正直、何をやってるのか分からない」だとか、「特殊業界っぽい」「Web系とはいろいろかけ離れてるんでしょ？」とか、「俺には関係ないね」だとか、さまざまな所感を耳にします。本記事によって、そういった疑問をお持ちの方にもIoT開発の雰囲気が伝わり、IoTエンジニアというロールに少しでも興味を持っていただけたら幸いです。 なお、私は普段、自ら
個人的にTypeScriptプロジェクトで使って良かったと感じたライブラリやツール、役立ったノウハウ・情報源へのリンクをまとめていきます。随時更新します。 記事更新時に通知を受け取りたい方はこの投稿を「ストック」してください。 追加された内容は更新履歴をご覧ください。 書籍 『実践TypeScript ~BFFとNext.js&Nuxt.jsの型定義~』 - JavaScriptからTypeScriptに来た人が読むと、JSとTSの差分を学ぶことができる本。 『JavaScript Primer: ECMAScript 2019時代のJavaScript入門書』 - すでにプログラミング経験がある人が読むとJavaScriptの文法や機能を中心に学ぶことができる本。TypeScriptを書くにもJavaScriptの知識が必要不可欠なので、雰囲気でJSを書いてきた人やちゃんとおさらいしたい
Web フロントエンドフレームワーク選定前に知っておくべき Angular の 6 つの問題点と、それでも Angular を選ぶ理由 - Qiita
Web フロントエンドフレームワーク選定前に知っておくべき Angular の 6 つの問題点と、それでも Angular を選ぶ理由JavaScriptAngularフロントエンド 2019/12/04 追記 @okunokentaro さんが熱いアンサー記事を書いてくれました。 Angularでの開発を快適に進めるために知っておきたいこと https://qiita.com/okunokentaro/items/503ab7a4c7601b564de0 https://gist.github.com/okunokentaro/dc4cd470999fd90aba73423d09a37485 本当に本当にありがたいです。この短時間でこんな良質の記事が書けるのは本当にスゴイ。 Angular コミュニティの暖かさと熱さを感じる 1 日でした。この記事もぜひ参考にしてください。 （ただ、「A
大統一 Node ツールチェイン Rome の野望 現状の実装
つい先日 beta リリースされたフロントエンドのツールチェインの Rome について、その思想とコードを読んだ結果の現状について。 Rome Frontend Toolchain この記事は公式ドキュメント以外にもソースを読んで得られた undocumented な部分も含んでいるので、すぐ古くなる。その前提で読むように。 問題の認識とその解決手段 フロントエンドの最適化は実行前のプリプロセスに、エコシステムの開発リソースの多くが当てられている。Node のツールチェインが発達するにつれて、自前の パーサ+AST 定義を持つ実装が増えていった歴史がある。 acorn(estree) babel prettier typescript terser それぞれのツールの生成する AST はそのツールの都合で微妙に/もしくは大幅に定義がずれている。typescript に至っては完全に別物。こ
こんにちは、 フロントエンドエンジニアの @nabeliwo です。 弊社には SmartHR というプロダクトの他に SmartHR の従業員 DB を利用して開発・提供される SmartHR Plus アプリ (以下、 Plus アプリ)というものがあります。 SmartHR CTOが語る中長期戦略。徹底的なアプリ開発とAPI対応で「プラットフォーム化」促進へ - SmartHR ガイド 既に多くの Plus アプリがリリースされており、そのほとんどのプロダクトのフロントエンドは React x Redux という技術スタックで構成されています。 オンライン雇用契約 カスタム社員名簿 ラクラク人事レポート etc Plus アプリは毎回新規でプロジェクトを立ち上げて開発していくことになります。 とはいえブランディングの観点から見ると、基本的なトンマナや UI パーツは SmartHR
株式会社ラクスが開催するエンジニア向けのイベント「RAKUS Meetup」。今回は「Vue.js、React、TypeScript、E2Eテスト」をテーマに、「楽楽勤怠」の機能開発を担当する北嶋初音氏が登壇し、「Vue.js + TypeScriptによる新規サービス開発の振り返り」という内容で話をしました。関連資料はこちら。 会社初のフロントエンドエンジニア 北嶋初音氏（以下、北嶋）：では、「Vue.js + TypeScriptによる新規サービス開発の振り返り」と題して、UI開発課の北嶋初音が発表を始めたいと思います。 まず軽く自己紹介します。名前は北嶋初音と言います。経歴ですが、2016年の4月からWeb系のITベンチャーに新卒入社しまして、Webエンジニアとしての経験を積みました。次は自社サービスを作っている会社で働きたいという気持ちがあったので、転職活動を始めて、今年の1月から
GitHub Actions のワークフローをチェックする actionlint をつくった - はやくプログラムになりたい
GitHub Actions のワークフローを静的にチェックする actionlint というコマンドラインツールを最近つくっていて，概ね欲しい機能が揃って実装も安定してきたので紹介します． github.com なぜワークフローファイルの lint をすべきなのか GitHub Actions が正式リリースされてからだいぶ経ち，GitHub 上での CI は GitHub Actions が第一候補となってきているように感じます．僕も新規にリポジトリを作成して CI をセットアップする場合はほぼ GitHub Actions を使っています． ですが，GitHub Actions には下記のような問題があり，actionlint でそれらを解決・緩和したいというのが理由です． ワークフローを実装する時は，GitHub に push して CI が実行されるのを待って結果を確認するという
ちょっと複雑なシェルスクリプトをJavaScriptで書く - lacolaco-engineering
ちょっと複雑なシェルスクリプトを https://github.com/google/zx を使って書くとJavaScriptプログラマにとってはメンテナンスしやすい /lacolaco/lacolaco.iconはzx歴 3-4ヶ月ってところ (2021-08) 嬉しいところ async/awaitが使える 配列が扱いやすい モジュールで再利用しやすい 他のNode.jsライブラリと併用できる Prettierでフォーマットしやすい Lintしやすい エディタ支援が安心 Made by Google 微妙なところ JavaScriptプログラマ以外にとっては無用 とはいえシェルスクリプトによほど慣れてる人以外はよく整理されたJavaScriptのほうがセマンティクスを読み取りやすいのではないか スクリプト自体はこんな感じ（公式READMEより） code:js #!/usr/bin/en
3-shake にはSreake共有会 という毎週、火曜日と木曜日に担当者が現場で得た知見などを発表する社内勉強会が開催されています。こちらのブログはそれらを変更修正しております。 syu-m-5151.hatenablog.com 元々しようとしていたの話 Go 1.18 の最新情報←Generics の深い話とかはもう既出すぎて気になる人は読んでる Go でのTDD(が実は20周年なので)←書いてる途中で自分が言うべきことなんてないことに気付く 今後、案件で増えるであろう gRPC についてインフラエンジニアが知っておいても良いと思ったという話 ← 今ここ TL;DR protobuf (Protocol Buffers) はデータフォーマットで、JSONの役割を置き換えるものです。一方 gRPC は通信プロトコルで、HTTPの役割を置き換えるものです。 gRPC をライブラリやツール
はじめに なぜ遅いのか 何をやるのか 計測 名前付きボリュームを使ってない場合 Named Volumeを使う場合 Macからどう見えているか 結論とまとめ はじめに 以前からいろんなところで話していますが、僕は普段、手元のMacには言語系のランタイムとかは入れておらずVS CodeとDocker for Macだけ入れてRemote Containersの環境で開発しています。 この環境自体はとても便利でいいのですが、一点大きな問題があります。 それは遅いということ。自分の場合は最近だとJSでの開発が多いのですが、例えばNext.jsで開発している場合に以下のような操作が特に遅く感じます。 yarn install yarn add yarn jest next dev next start next build yarn jestとかnext devが遅いのは起動だけだったりします。起
とある大規模開発プロジェクトの中で WebView 用のフロントエンドシステム開発を立ち上げて2ヶ月経ちました。Android, iOS専任のエンジニアがいないため、外部協力者の指導のもと、モバイルアプリの画面を WebView で作るためです。 ある程度その営みについて見えてきたものがあるので記事にまとめることにしました。 プロジェクト参加人数は30名以上 プロジェクト自体は4ヶ月前から動いてる このプロジェクトへのフロントエンドチームの参加は1月から 現在 WebView とモバイル・バックエンドなどの結合試験をはじめている 背景 去年12月いまの会社にテックリードとして入社し、前述とは別のプロジェクトでフロントエンドチーム立ち上げを行っていました。同タイミングで、いまの会社に誘ってくれた飲み仲間もテックリード・チームリーダーとして入社しています。フロントエンドチームはこの2名がプロパ
Ansible使いの人はちょっと見逃せない。AWS Systems Managerで複雑な構成のAnsible-Playbookの実行が可能になりました | DevelopersIO
AWS事業本部 梶原@新福岡オフィスです。 数日前に、AWS Systems Manager で複雑な構成のAnsible-Playbookの実行がサポートされました。 https://aws.amazon.com/jp/about-aws/whats-new/2019/09/now-use-aws-systems-manager-to-execute-complex-ansible-playbooks/ 一瞬、以前からAnsible Playbookの実行はできてたじゃん。とスルーしそうになったんですが、Complexの文字が目にとまりました。 よくよく読んでみると、S3 or Github上のzip またはディレクトリ構造のPlaybookを実行できるとの記載があります。 そうです、AnsibleのBest Practicesに沿った構成のまま、EC2上でAnsible-Playboo
ニッチな話題ですが、業務におけるCI/CDの現場では避けることのできない大規模リポジトリと戦うためのgit cloneのテクニックを紹介します。 この記事はDeNA Advent Calendar 2020の10日目の記事です。 CI/CDマニアの@Kesin11です。SWETではCI/CDチームの一員として、CI/CDの啓蒙活動やJenkinsを必要とするチームのサポートなどの業務を行っています。 はじめに おそらくどこの会社でも1つぐらいは巨大なリポジトリが存在しているかと思いますが、歴史あるリポジトリはgit cloneするだけで数分を要し、checkout後のリポジトリサイズがGB単位になることも珍しくないでしょう。業務で古くから存在するプロジェクトのリポジトリを触ったことがある方はきっと経験があるかと思います。 git cloneを実行するのは最初のセットアップ時だけなのであまり
Rust開発時の便利ツールたち
前書き Rustを書くときに便利なツールをまとめた記事が無い気がしたので作成。(ちゃんと探してないので既にあるかも) 公式ツール cargo パッケージマネージャ 基本だけどとても便利なツール 一度はThe Cargo Bookを読んでおくことを推奨。 rustfmt フォーマッター cargo fmt でもフォーマットの修正が出来る。(こっちを使うことが多い) clippy lintツール こう書いたほうが良いよという提案もしてくれるので便利。 cargo clippy --fix を使うと自動で直してくれる。 rust-analyzer Language Server rls もあるが、(最近は?) rust-analyzer の方がメジャーな気がする。 追記 : RLSは非推奨になりました。RLS Deprecation 非公式ツール cargo-watch ソースコードの変更を検知
はじめにフューチャー技術ブログのリレー形式の連載である、春の入門祭り2023の1日目です。TIG真野です。 ここ数年、Markdownで設計書をチームで書き、GitHub（GitLab）上でレビューするフローを採用しています。なるべくテキストベースで設計開発フローを統一するため、私の所属するチームでは以下のようなツールを採用しています。 シーケンス図、業務フロー図 Markdown中にPlantUMLで記載 参照はGitHub上からも見れるように、pegmatite を利用 システム構成図など画像系 Diagrams.net（draw.io）で作成し、.drawio.png の拡張子でMarkdownから参照 これだけは目視で差分チェックとなる Web API定義 OpenAPI SpecのYAMLファイル 参照はGitHub上からも見れるように、swagger-viewer を利用 ER
インフラ・ストリーミングチームの id:udzura （@udzura）です。今回は、Goミドルウェアのメモリリークを見つけて解決する際に、どのようなプロセスを踏んでいったかを解説します。 Go製のミドルウェアの概要 ミラティブでは、Webアプリケーションのみならず、ミドルウェアに相当する部分についても必要なものは内製しています。その中の一つに、社内で「Radisha」と呼んでいる各種集計とキャッシュなどを行うためのミドルウェアがあります。Radishaは以下のような特徴を備えています。 GET、SET、SETEXなど基本的なRedis互換のコマンドを実装している。そのため、既存のRedisクライアントライブラリから操作が可能である。 ランキング集計、一定時間内のアクセス集計などが行えるよう、Redis にない独自のコマンドを実装している。 高い可用性を志向しており、オンメモリのデータは
先日初めて真面目に自分のコードを OSS として公開する機会があり、色々試行錯誤したのでまとめます。 何を公開した？ Vue Word Highlighter という Vue.js のコンポーネントライブラリを公開しました。 機能はとても単純で、文字列と検索クエリを渡すと検索クエリに合致した文字をハイライトする（<mark>タグ又は任意のタグ囲む）というものです。 自分なりに良い感じに使えるコンポーネントが出来たので、せっかくならば多くの人に使ってもらいたいと思い以下で記載する諸々をやってみました。 公開までにやってみたこと 🗒 READMEをちゃんと書く OSS の顔と言ったら README なので、ひと目でちゃんとしてそうな OSS 感を出すために README は整備しました。 ロゴを作る Google Font で良さそうな書体を探し一部をハイライトしただけの単純なものですが、ラ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「インフラエンジニアには難しい」「手でやったほうが楽」も解消 これからCDKを使う人向けの4つのナレッジ
Webサービスを作るときのテンプレートを作った - hiroppy's site
プログラミングスクールを卒業しました - ksmxxxxxx.hatebu
GASの開発環境をローカルで作成する方法（2023年7月版） | DevelopersIO
めんどくさい作業を改善できるようになるには - Konifar's ZATSU
Prettier と ESLint の組み合わせの公式推奨が変わり plugin が不要になった
フロントエンド初心者がGatsbyでブログを作り直した話 - As a Futurist...
ようこそdotfilesの世界へ - Qiita
Reactを使ったモダンなフロントエンド開発の環境構築 - Qiita
Go言語プログラミングエッセンス
「斧を研ぐ時間」エンジニアリングフライデーという試み - 弥生開発者ブログ
npm-scripts を書く時の手癖 - mizdra's blog
厳選TypeScript 〜おすすめしたいライブラリ、ツール、ノウハウ、情報源のリンク集〜 - Qiita
プロダクト間共通の React コンポーネントライブラリを運用する話 - SmartHR Tech Blog
新規機能はどんどんコンポーネント化 Vue.js + TypeScriptで開発してよかったこと・つらかったこと
インフラエンジニアが学ぶと良さそうなgRPCサーバーについて - じゃあ、おうちで学べる
Macで使うVS CodeとRemote Containerの性能を大幅改善 - Sweet Escape
大規模チームの中でフロントエンドを立ち上げて2ヶ月経ったのでまとめる
大規模リポジトリで高速にgit cloneするテクニック - DeNA Testing Blog
markdownlintで設計書の品質を高める | フューチャー技術ブログ
Go製ミドルウェアのメモリリークを解決した話 - Mirrativ Tech Blog
真面目にOSSを公開する際にやってみたこと・意識したこと