最近はお客さんとの勉強会でDockerのドキュメントをつまみ食いして読むというのをやっていますが、改めて最新版を読んでみて、いろいろ思考が整理されました。2020年の20.10のマルチステージビルドの導入で大きく変わったのですが、それ以前の資料もweb上には多数あり「マルチステージビルドがよくわからない」という人も見かけるので過去の情報のアンラーニングに使っていただけるように改めて整理していきます。 仕事でPythonコンテナをデプロイする人向けのDockerfile (1): オールマイティ編で触れた内容もありますが改めてそちらに含む内容も含めて書き直しています。 本エントリーの執筆には@tk0miya氏から多大なフィードバックをいただきました。ありがとうございます。 基本的なメンタルモデル現代的な使い方を見ていくために「Dockerを使ってビルドする」というのはどのようなものか考えを整
はじめに 私はMarkdownで文章を書くのが好きです。もちろんこの記事もVSCodeを開いてMarkdownで書いています。 おそらくエンジニアであればMarkdownとの出会いはGitHubにReadMeを書くことなんじゃないかなと思います。 私もプログラミングを勉強しはじめたとき、 簡単なデータベースの関係図を書くのが課題だったような気がします。 ご存じの通りMarkdownは文字だけで表が書けたりして h2やh3などの見出しを#の数で表現できたり自分の中ではかなり感動したのを覚えています。 今現在は生成AIでの出力にMarkdownが使われているので エンジニア以外にもすっかり馴染んだと思いきや... 意外とまだまだMarkdownが知られていないなと感じることがありました。 この記事ではまだMarkdownの魅力に気がついていない人に向けて 自分なりのMarkdown愛を語ってい
はじめに VSCodeで、index.tsやpage.tsxなど、同名のファイルを複数同時に開いてしまい、わからなくなってしまったことはありませんか？ 実はよく見ると同一名称のファイルを開いているときには右側にディレクトリ名も表示されているのですが、薄い文字かつ、目線移動が必要で分かりづらいです。 この記事では、VSCodeの設定を変更することで、タブ表示名にディレクトリ名を含めて表示する方法を紹介します。 設定方法 VSCodeの設定ファイルsettings.jsonに以下の設定を追加します。 "workbench.editor.customLabels.patterns": { "**/index.*": "${dirname} .../${dirname(1)}", "**/{page,layout,template,route,actions,hooks,components,ut
Visual Studio Code の Emmet機能を使ってコードを楽に書こう - Qiita
エンジニアのみなさま、日々の学習本当にお疲れ様です！ また本記事まで足を運んでいただき本当に感謝です。 約1分程度で読めるので最後まで読んでもらえると幸いです。 はじめに コードを書くのに慣れてくると、いちいちコードを書くのが煩わしくなりませんか？ そんな時 Visual Studio Code（以下、VSCode） の Emmet機能 を使えば、HTML等、特にWEB関連のコードを書くときに補完をしてくれるため、作業効率が格段にUPします。 騙されたと思ってぜひ一度お試しくださいませ！ 設定方法 1. VSCodeを開き、画面左下の「⚙️」 > 「設定」をクリック 2. 「emmet」と検索し、画面中段にある「Emmet: Trigger Expansion On Tab」にチェック 以上になります。 どんな事をしてくれるのか？ あるコマンドを入力後、「Tab」を押す事で良しなに補完をし
目次[非表示] 1.はじめに 2.結論 3.Visual Studio Codeとは 4.Cursorとは 5.VSCode→Cursorへの乗り換えは？ 6.VSCode vs Cursor 6.1.1.ChatGPTが標準で搭載されている 6.2.2. コードをその場で編集・チャットに挿入できる 6.2.1.コードをその場で編集（⌘＋K） 6.2.2.コードを1クリックでチャットに挿入（↑+⌘＋E） 6.3.3. フォルダ単位、プロジェクト単位でコードを参照してChatGPTに質問できる 7.さいごに 8.参考リンク 9.お悩みご相談ください はじめにDIVXでエンジニアをしている松田です。 突然ですが、「Cursor」をご存じでしょうか？ AI機能を搭載していることで話題となっているテキストエディタです。以前、「Cursorを使ってみた」という記事を目にしたことがある方もいるかもしれ
こんにちは。 名刺アプリ「Eight」でエンジニアをしている鳥山（@pvcresin）です。 最近、ミスタードーナツのミニオンコラボの商品を食べたのですが、 どれも美味しくて見た目もかわいいので最高でした。 特にポン・デ・リングベースのものは、表面のキャンディが口の中でパチパチと弾けて楽しいのでオススメです。 さて今回は、RailsのViewで使う、HTML用ERBファイルのフォーマットを統一した話をします。 ERBとは ERB（eRuby、embedded Ruby）はテキストにRubyのコードを埋め込むための仕様です。 Railsでは特にViewの部分のHTML生成によく利用されます（拡張子は.erb）。 ERBでは、以下のような記法でRubyのコードを埋め込めます。 <ul> <% @features.each do |f| %> <li><%= f %></li> <% end %
3rd Party Cookie 廃止の方針変更など : Cybozu Frontend Weekly (2024-07-23号)
3rd Party Cookie 廃止の方針変更など : Cybozu Frontend Weekly (2024-07-23号) こんにちは！サイボウズ株式会社 フロントエンドエキスパートチームの @mugi_uno です。 はじめに サイボウズ社内では毎週火曜日に Frontend Weekly と題し「一週間の間にあったフロントエンドニュースを共有する会」を開催しています。 今回は、2024 年 7 月 23 日 の Frontend Weekly で取り上げた記事や話題を紹介します。 取り上げた記事・話題 Temporal を取り巻く仕様を整理する ECMAScript Stage 3 の Temporal に関する発表資料です。仕様そのものの整理や、タイムゾーン・カレンダーのサポート、Intl との関係性について解説されています。 Fastly が開発者向けの無料プランを提供開始
現在のWordPress標準制作フロー 5年前に記載したこちらの記事は、もう昨今の作業環境には適合しなくなりました。 2024年現在での弊社の標準的な制作フローをご紹介します。 WordPressを扱うエンジニアに対する質問事項で記載した回答例と一部重複しますが、より詳細に案内したいと思います。 前提事項 5年前の記載内容と前提事項は同様です。 Web制作会社などでいちからサイトを制作することを想定 汎用テーマなどを使って簡易に構築するとかではなく、ガッツリとそのサイト専用のテーマを作成する それぞれのツールのインストール方法などは記載しない Qiita内で丁寧に手順を記載している記事があるので検索してみてください ローカル開発環境 WordPressでサイト制作を決めた場合、携わるエンジニアは開発環境として何を使えばよいでしょうか？ 我々の回答としては、基本的には@wordpress/e
はじめに Github Copilotって便利ですよね。コードを一部分だけ打っても、内容を予測して続きを予測して補完してくれます。 マークダウンファイル内では文字列についても使えます。 VScode + Github Copilotっぽいエディタを自分でも作成してみました。 技術的な学びについて解説を加えていきます。 なお、Claudeを使いながら作成しているため不自然なコードが含まれている可能性があります。ご注意ください。 作ったもの 文字を入力すると、予測した続きの文章がグレーで表示されます。Tabキーを押すと確定します。 解説している技術的要素 useRef 日本語IMEの入力状態判定 デバウンス処理 useEffectのクリーンアップ関数 イベントリスナー（onKeyDown）を使用したキーボード入力の処理 カーソル位置の移動 コード コード import { NextRespon
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
2024年版のDockerfileの考え方＆書き方 | フューチャー技術ブログ
おいでよMarkdown界隈へ -生成AIでスライド作り-
【index.ts】そのVSCodeタブ名、わかりづらくない？【page.tsx】
VSCode vs Cursor〜コーディング環境を制するものはどちらか？ | 株式会社divx（ディブエックス）
HTML用ERBファイルのフォーマットを統一した話 - Sansan Tech Blog
WordPress標準制作フロー2024 - Qiita
Github CopilotみたいなAIアシスト日記エディターを作る