【2020年1月】令和だし本格的にVSCodeのRemote Containerで、爆速の"開発コンテナ"始めよう - Qiita
【2020年1月】令和だし本格的にVSCodeのRemote Containerで、爆速の"開発コンテナ"始めようJavaPythonPHPJavaScriptGo VSCode の Remote Conainer で"開発環境+プロジェクト全部入りのコンテナ"からスタートダッシュをキメるッ！？ 開発でVS Code の Remote Conainer使っていますか？単に既存のコンテナに入るだけなら Remote SSH でも構いませんが、"ローカル開発環境の一部"として、いやむしろローカルの開発環境＝Remote Containerとして、ビンビンにRemote Container使っていきましょう。令和だし！(すでに２年だけどね・・・？) 特にMacを使っていると最初からPythonやらPHPやらRubyやらが入ってしまっているので開発環境があるのですが、これらは割とmacOSのエコシ
2022年、フロントエンドで注目されているJavaScriptやCSSのフレームワーク・ライブラリ・ツール・エディタ・機能などのまとめ
2022年、フロントエンドで注目されているJavaScriptやCSSのフレームワーク・ライブラリ・ツール・エディタ・機能などを紹介します。 今使用しているものはどんな感じか、これから勉強するならどれがよいか、知らない便利なツールや機能はないかなど、フロントエンドの制作で参考になる資料です。 State of frontend 2022 State of frontend 2022は、125か国のフロントエンドデベロッパーにアンケートをおこない、注目されているフレームワーク・ライブラリ・ツール・機能などをまとめたものです。 ここ2年のコロナ禍により、勤務形態が大きく変化しました。データは2022年と2020年の状態も比較できます。 あなたの勤務形態は？ 56%の人がリモートワークをしており、オフィスで働いている人はわずか5%でした。2020年の調査ではこのアンケートをおこなっていませんが、
「自分が現場に関与しなくても開発組織が円滑に回る状態」が理想。花谷拓磨がフロントエンドエンジニアとして実現したいこと
LINE株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。 LINEヤフー Tech Blog LINEで働くエンジニアにいろいろと話を聞く「LINE Engineer Insights」。LINEの技術組織で働く個々人に、何を重視して技術者としてのキャリアを歩んでいるのか、今LINEで何に取り組んでいるのか、今後実現したいことなどを聞いていきます。 今回登場するのは、フロントエンド開発センターに所属する、フロントエンド領域のスペシャリストでありエンジニアリングマネージャーを担う花谷拓磨です。花谷がLINEに入った理由や働くうえで大切にしていること、OSS活動にかける思いなどをインタビューし支える思想や行動指針を聞きました。 事業や組織の核心に迫る仕事に携わりたくて、LINEへ入社 ――花谷さんがLINEに入った理由につ
buildkit/frontend/dockerfile/docs/syntax.md at dockerfile/1.4.3 · moby/buildkit
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
こんにちは！スマートキャンプでWebアプリケーションエンジニアとして働いている中川です。 さて、唐突ですがみなさんは別の開発チームに異動した経験はありますか？ いくつかプロダクトを抱えていたり受託開発をしている会社では割とよくある現象なので、少なくない数の方が経験されたことがあるかなと思います。 と、この書き出しで察しの良い方はお気づきかと思いますが、かくいう自分もこの度チームを異動して、6月からBOXIL開発チームで働いています。 今回の記事では、自分が新しいチームに参加することになったときにどういうキャッチアップを行っているかについてご紹介していこうと思います！ また、今回の記事で前提としているのは異動のシーンですが、転職でも通ずるような内容は多いと思っています。 キャッチアップする目的を考える なにをキャッチアップしていくか考える プロダクトに慣れる ビジネスモデルを知る 使われてい
こんにちは。LINEフィナンシャル開発センター フロントエンドエンジニアの峯です。 先日新卒としてLINE証券プロジェクトに配属となり、最初のタスクとしてRecoilによる状態管理の導入に取り組みました。 その際、なぜRecoilにしたのか、また本番開発にRecoilを使うにあたって設計に気をつけたことなどを本記事でご紹介しようと思います。 技術選定 いままでの状態と課題 LINE証券フロントエンドではReact+Typescriptによる開発を採用しており、いままでのグローバルな状態管理にはUnstated を用いていました。 Unstatedでは Container classを状態の単位とし、その内部の stateを setState によって更新します。状態を使用したいコンポーネント側では、<Subscribe> コンポーネントによって情報を読み出すことができます。 一方ご存知の通
こんにちは。 印刷のラクスルでフロントエンドを担当している菅野です。 現在、稼動中のとあるプロダクトへのTypeScript導入を進めています。今回は、既存プロダクトへの影響を最小限に留めつつTypeScriptを導入する手順をご紹介します。 TypeScriptとは TypeScript - JavaScript that scales. TypeScriptは、Microsoftが開発したオープンソースのプログラミング言語です。 詳細な説明は省きますが、以下のような特徴があります。 JavaScriptの厳密なスーパーセット(≒上位互換) 省略可能な型システム クラスベースのオブジェクト指向 TypeScript導入にあたって 今回TypeScriptを導入することで、以下のようなメリットがあります。 型システムの恩恵が得られる エディタの入力補完を受けられる コード=ドキュメントとい
当社のフロントエンドコーディング標準技術について
当社はConcrete CMSを用いたWebサイト構築を主な業務としております。また、フロントエンドのみの構築（いわゆるコーディング）のご依頼も承っております。その中で、ご依頼の際に当社が標準的に採用している技術についてご説明する機会は多々ありますが、対外的にまとまって記載したページがこれまでなかったため、こちらのブログにまとめることとしました。ご依頼いただく際の参考にしていただければ幸いです。 CSSフレームワーク 当社ではCSSフレームワークとして Tailwind CSS （テイルウィンド・シーエスエス）を採用しています。Tailwind CSS は、2022年の調査において、直近４年間を通して満足度・興味・利用率の全てで１位を獲得し続けている、現在のフロントエンドデベロッパーから最も支持されているフレームワークです。Microsoft, Google, GitHub, Shopif
この記事は、Mercari Bold Challenge Monthの1日目の記事です。 こんにちは、MercariのArchitectチームでDesign Systemに取り組んでいる@usagi-fです。 Design Systemはただのスタイルガイドラインではなく、会社として保持するデザインフィロソフィーから実装コードに落とし込まれたUIコンポーネントまで、広い範囲をさす言葉として認知されてきています。 現在私たちは本格的に構築へ着手しており、少しずつ進捗が見えてきました。この記事では主にDesign Systemにおける「UIコンポーネントの定義と実装」の部分に焦点をあて、私が担当しているWeb Frontendの事例を紹介していきます。 MercariにおけるDesign System Mercariでは将来的な組織規模の拡大に向けて様々な取り組みを行っていますが、Design
Python 3.11から追加された標準パッケージtomllibの紹介 | IIJ Engineers Blog
2018年新卒入社し、SOCにてインフラ管理を担当。その後、マルウェア解析や検証業務などに従事。2022年度からは、社内のSREチームにて兼務を開始。主な保持資格は、CISSP, OSCP, GREM, GXPN, RISS, CKA, CKSなど。バイナリを読むのが好きで、一番好きな命令はx86の0x90（NOP命令）。 はじめに 私は、業務でマルウェア解析のようなリバースエンジニアリングをしており、業務効率化のために自作ツールを作ることがあります。皆さんは自作のツールの設定ファイルに、どのようなファイル形式を利用していますか。昨今は、KubernetesやAnsibleなどで用いられるYAMLや、フロントエンド界隈で頻繁に利用されるJSONなどが多い印象です。そんな中、今回はTOMLと呼ばれるファイル形式の紹介をします。プログラミング言語Rustのパッケージ管理ファイルに利用されていた
Go: A Documentary
Go: A Documentary by Changkun Ou <changkun.de> (and many inputs from contributors) This document collects many interesting (publicly observable) issues, discussions, proposals, CLs, and talks from the Go development process, which intends to offer a comprehensive reference of the Go history. Disclaimer Most of the texts are written as subjective understanding based on public sources Factual and ty
こんにちは、@giginetです。 先日、新卒以来7年3ヶ月勤続したクックパッド株式会社を退職しました。 本日、クックパッド株式会社の最終出社でした！新卒で入社してから7年3カ月お世話になりました。最高の職場だった！ 👋 pic.twitter.com/VJLF3yh9UB— giginet (@giginet) 2022年6月24日 このエントリは5年半振りの当ブログの更新になるのですが、いわゆる退職エントリというやつです🇨🇳👨🍳🍗 でっ誰？ @giginet https://github.com/giginet/ https://twitter.com/giginet 前職：クックパッド株式会社 2015年4月に新卒入社、2022年6月に退職 モバイル基盤部テックリード 現職：LINE株式会社 2022年7月15日に入社 🐣 ディベロッパーエクスペリメンス開発室ビルドエ
新規事業開発での技術選定の意思と意図 (バックエンド編) - Sansan Tech Blog
こんにちは、新規事業開発室に所属するソフトウェアエンジニアの加藤です。私は関西支店でBill Oneという新規サービスの開発に携わっています。 弊社にはSansanのカタチという企業理念があり、働く人々が体現すべきValuesの1つに「意思と意図をもって判断する」があります。ソフトウェアエンジニアとして、意志と意図をもって利用する技術を選定することは当然かもしれませんが、細部までそれを徹底するのは難しいこともあります。本稿では、私たちが使用している技術やライブラリを振り返って、どんな意志と意図があるかを確認していきたいと思います。 などと硬めのことを書きましたが、他所のチームでは普通に使われているライブラリを意外と知らなかったりするので、似たような記事を読みたいなと思って、技術選定を公開してみる次第です。まずはバックエンド編です。 前提 私たちのチームで開発しているBill Oneは今年の
Linux perf Examples
Recent posts: 24 Mar 2024 » Linux Crisis Tools 17 Mar 2024 » The Return of the Frame Pointers 10 Mar 2024 » eBPF Documentary 28 Apr 2023 » eBPF Observability Tools Are Not Security Tools 01 Mar 2023 » USENIX SREcon APAC 2022: Computing Performance: What's on the Horizon 17 Feb 2023 » USENIX SREcon APAC 2023: CFP 02 May 2022 » Brendan@Intel.com 15 Apr 2022 » Netflix End of Series 1 09 Apr 2022 » Te
概要 こんにちは、Offers を運営している株式会社 overflow の Software Engineer（主戦場はフロントエンド）の Kazuya です。2022 年 2 月入社でそこまで日が経っていないので、今回は社内の技術スタックではなく、今後社内でも検討されるかもしれない「BFF」について触れていきたいと思います。BFF（Backend For Frontend）導入することで得られるメリット/デメリット、GraphQL を用いた技術スタック事例など紹介していますので、ぜひ参考にしてもらえればと思います。 BFF とは？ BFF とは、Backend For Frontendの略称で、「フロントエンドとバックエンドの中間に配置され双方の複雑な処理を緩和させる責務を持つアーキテクチャ設計パターン」のことです。これだけだと分かりづらいので簡単にまとめると、「バックエンドの API
私が考えるマイクロサービスアーキテクチャ
はじめに 以前に、マイクロサービスアーキテクチャにゼロから挑んだ開発経験から、私が現時点で考えるマイクロサービスアーキテクチャを書いてみる。前回はAWSで構築したがAWSに限定せず汎用的に表現してみたいと思う。 前提 例として、社員の勤怠と有給の管理ができるようなwebのSaaSプロダクトを考える。 ここでいうプロダクトとは商品として販売できる最小の単位とする。 境界づけ まずは、プロダクトを5つの機能に分類する。 認証・・・認証を行うIdP。ユーザー固有のIDを管理するユーザーディレクティブを持つ。 ユーザー・・・認証されたユーザーと権限の紐付きを持つ。 権限・・・ロールとポリシーによる権限を設定する。「ユーザー」「権限」「勤怠」「有給」というサービスそれぞれに個別の設定ができる。 勤怠・・・勤務の開始と終了を管理できる。 有給・・・有給の付与、消化、残日数の管理ができる。 パターン1：
ZOZOTOWN Webフロントエンドリプレイスにおける CSS in JS の技術選定で Emotion を選定した話 - ZOZO TECH BLOG
はじめに こんにちは。ZOZOTOWN開発本部フロントエンドの菊地（@hiro0218）です。 現在、ZOZOTOWNではWebフロントエンド技術のリプレイスプロジェクトが進行しています1。本記事では、WebフロントエンドのリプレイスでCSS in JSの技術選定をした際の背景や課題についてご紹介します。 既存技術スタックの課題 リプレイス以前の環境は、Classic ASPのテンプレートエンジンに依存したUI実装が多く存在しており、新規開発や変更のタイミングで実装をReact + CSS Modulesへ改修しています。そのため、レガシーな実装とモダンな実装が共存した状態です。 こういった背景から、リプレイス以前のUI開発では以下のような課題がありました。 グローバルなCSSが多く、CSSの変更がどこへ影響するのか予測しづらい Classic ASPのテンプレートエンジンに依存したUI実
React + Amplify + AppSync + DynamoDB でサーバレスなWebアプリを作成する公式チュートリアルをやってみた | DevelopersIO
React + Amplify + AppSync + DynamoDB でサーバレスなWebアプリを作成する公式チュートリアルをやってみた Amplifyを使って React + AppSync + DynamoDB でサーバレスなWebアプリを作成するチュートリアルをやってみました！ 大阪オフィスのYui(@MayForBlue)です。 最近プライベートでAWS Amplify(以下Amplify)を触っていて、良さげなチュートリアルを見つけたのでやってみました。 Amplifyを使って React + AppSync + DynamoDB でWebアプリを作成するものです。 デプロイについてはチュートリアルで紹介されているS3でのホスティングではなくAmplify Consoleを使ってCI/CDできるようにするなど少し工夫してやってみました。 Amplify JavaScript
この記事はBASE Advent Calendar 2020の22日目の記事です devblog.thebase.in どうもこんにちは、Web Frontend Groupの青木です 今回は、個人的にWeb開発を補助する目的でPuppeteerを使っていることがあるので、その話をします 前半では、普段どう使っているのか 後半では、ブラウザ操作を記録してコード生成してくれるRecoderについて紹介します そもそも、Puppeteerって? Puppeteer is a Node library which provides a high-level API to control Chrome or Chromium over the DevTools Protocol. Puppeteer runs headless by default, but can be configured t
11月2日（土）に実施された、FRONTEND CONFERENCE 2019 の登壇資料のまとめです。 資料を発見次第随時アップデートしていきます。
この記事はGraphQL Advent Calendar 2021の22日目の記事です。 またこれは書籍、出来る100%TypeScript 作って学ぶNext.js + GraphQL + Prismaに掲載していたコラムに加筆修正を行ったものです。 GraphQLは一言でまとめてしまえばDSL(GraphQL query language)による宣言的な記述を介してGraphQLサーバーから柔軟にデータを取得/提供する事が出来る仕組みです。文法は全く異なりますが動作モデルとしてはSQLとRDBの関係に近いかもしれません。なおHTTP上で利用される事がほとんどですが特に決まりがあるわけではありません。 元々はFacebook社(現Meta社)で開発され2012年からfacebook.comで利用されている技術で、その後2015年にはオープンソース化されFacebook以外でも徐々に利用さ
はじめに 2021年1月にv1.0がリリースされたWasmerにRuby Gemが存在することに触発されて調べてみました。RubyとWebAssemblyが関わっているものについてわかる範囲でまとめ、軽くどのようなものかを書いていきます。 僕自身、業務はおろかプライベートでもWASMを書いたことはなく浅い理解しかしていないですが…… WebAssembly (WASM)とは WebAssembly は最近のウェブブラウザーで動作し、新たな機能と大幅なパフォーマンス向上を提供する新しい種類のコードです。基本的に直接記述ではなく、C、C++、Rust 等の低水準の言語にとって効果的なコンパイル対象となるように設計されています。 この機能はウェブプラットフォームにとって大きな意味を持ちます。 — ウェブ上で動作するクライアントアプリで従来は実現できなかった、ネイティブ水準の速度で複数の言語で記述
The goal for the State of Frontend is still the same – we want to see the real day-to-day perspective from frontend professionals of all levels and backgrounds. Inside you’ll find answers to which technologies we love to hate but still use, which practices are sacred and which are neglected, and what future people see for themselves and the frontend landscape. We’re excited to see a varied represe
【Terraform🧑🚀】tfstateファイルの分割パターンとディレクトリー構成への適用 - 好きな技術を布教したい 😗
この記事から得られる知識 この記事を読むと、以下を "完全に理解" できます✌️ Terraformのtfstateファイルを分割する目的と、オススメの分割パターンについて (★) Terraformのリポジトリやリモートバックエンドのディレクトリ構成の設計について 記事のざっくりした内容は、以下のスライドからキャッチアップできちゃいます！ この記事から得られる知識 01. はじめに 02. なぜ tfstate ファイルを分割するのか 分割していない場合 分割している場合 分割しなくていい場合 03. tfstate ファイルの分割 分割の境界 状態の依存関係図 依存関係図とは 依存関係の表現 ▼ 依存関係の表現記法 ▼ 依存関係がない場合 ▼ 依存関係がある場合 04. tfstate ファイルに基づくその他の設計 リポジトリ 🐱 の設計 リポジトリ分割 ディレクトリ 📂 構成 リ
気付けば、もう年末ということで、2022 年に主要な Web ブラウザで実装された機能から個人的に気になったものをいくつか紹介します。 本記事は、11 月 26 日に行われた JSConf.jp のサイボウズのセッションの中で紹介した内容の詳細版になります。このセッションでは、フロントエンドエキスパートチームのメンバーが 2022 年の印象に残ったフロントエンドトピックについて話していますので、興味のある方は是非ご覧ください！ (4:51:50 あたりから始まります) 主要ブラウザ全てで実装された機能 ダイアログ要素 <dialog> Chrome Edge Firefox Safari
この記事ははてなエンジニア Advent Calendar 2021 の 22 日目の記事です。 昨日の記事は id:shimobayashi さんの アジャイル推進活動にここ1年で吉兆がみえてきた要因について - 下林明正のブログ でした。 Chrome の DevTools の UI 部分は Web 技術でできています。Web 技術でできているので、DevTools を DevTools で inspect することもできます。 example.com を inspect している画面を inspect している様子 このことを知ったのは、10MB くらいある JavaScript ファイルにブレークポイントを貼りつつデバッグしていたら DevTools が固まるようになってしまい、ブレークポイントを解除しようにもその前に DevTools がフリーズしてしまうので詰んだ……、という出
こんにちは。フィナンシャル開発センターの鈴木です。LINE証券のフロントエンドを担当しています。 以前の記事でご紹介した通り、LINE証券ではReactを使用しています。React 16.8で導入されたフックの機能は非常に革新的で、特にカスタムフックの概念によってReactにおけるコンポーネント設計は大きく様変わりしました。我々もフック時代のコンポーネント設計を試行錯誤しており、その結果はLINE証券にも反映されています。 この記事では、その中でも我々が最近ハマっている「カスタムフックを通じてコンポーネントを提供する」という、いわば“render hooks”とも言うべき設計パターンを紹介します。 今回のお題 今回は、「いくつかのチェックボックスがあり、全部チェックを入れると次に進める」という典型的なパターンを題材にしましょう。次の画像では3つのチェックボックスと「次へ」ボタンが並んでおり
REST API Design Best Practices Handbook – How to Build a REST API with JavaScript, Node.js, and Express.js
I've created and consumed many API's over the past few years. During that time, I've come across good and bad practices and have experienced nasty situations when consuming and building API's. But there also have been great moments. There are helpful articles online which present many best practices, but many of them lack some practicality in my opinion. Knowing the theory with few examples is goo
このパターンには2つの背景があります。ひとつは、技術者がマイクロサービスアーキテクチャパターンを採用して、複数の(理想的には単一目的で、独立してデプロイ可能な)サービスで構成されるアプリケーションを開発するようになったことです。ふたつめは、企業がコンテナ(Dockerなど)、オーケストレータ(Kubernetesなど)、プロキシ/ゲートウェイ(Envoyなど)といった、クラウドネイティブなプラットフォームテクノロジを支持するようになったことです。 意図 サービスメッシュが解決しようとする問題は次のようなものです。 サービスディスカバリ、ルーティング、アプリケーションレベル(レイヤ7)の非機能通信要件を処理する言語対応の通信ライブラリを、個々のサービス用にコンパイルする必要性の排除 外部サービスのネットワークロケーション、セキュリティ認証、サービス品質(QoS)目標など、サービス通信設定の外
「採用面接で必ず質問することは？」に対する、スマニュー・グリー・DMM・メルペイの答え #EMTalk レポート【後編】 | mercan (メルカン)
「採用面接で必ず質問することは？」に対する、スマニュー・グリー・DMM・メルペイの答え #EMTalk レポート【後編】 ──カルチャーフィットを見るとき、必ず質問することはありますか？ 2019年11月19日、組織づくりに携わるエンジニアたちが集まり、知見を共有し合うことを目的とした勉強会「EM Talk #1 〜エンジニア採用編〜」を、メルカリ東京オフィスで開催しました。この勉強会は、組織づくりに欠かせない採用・育成・配属・評価・制度などについて、過去の事例・失敗談・成功談・現在の取り組みを共有するというもの。 当日のコンテンツは、トークセッションとパネルディスカッションの2本立て。そこで今回のメルカンでは、トークセッションとパネルディスカッションそれぞれのレポートを前後編でお送りします。前編はこちら。 後編となる今回は、スマートニュースのエンジニアリングマネージャー（EM）である天野
Rails 6.1のDocker開発環境構築をEvil Martians流にやってみた（更新）｜TechRacho by BPS株式会社
更新情報 2019/11/20: 初版公開 2021/03/25: Rails 6.1.3.1に合わせて更新 2021/04/06: Ruby 3.0.1に更新 先々月に公開したこちらの翻訳記事の実践編ということで。試行錯誤しているうちにRailsが6.0.1になりました。 クジラに乗ったRuby: Evil Martians流Docker+Ruby/Rails開発環境構築（翻訳） Docker Desktop for Macについて これまではピュアな環境を求めてParallels Desktop for MacのUbuntu VM上でDockerを使っていたのですが、久しぶりにDocker Desktop for Macを使ってみると速度や使い勝手が随分よくなっていて驚きました。 Docker Desktop for Macの方がUbuntu VMのDockerよりビルドが速い（体感で
Platform Engineering on Kubernetes を読んでCloud Native の現在地を理解する - じゃあ、おうちで学べる
はじめに 近年、Kubernetesの採用が進む中、複数のチームが関わり、複数のクラウドプロバイダーへのデプロイを行い、異なるスタックを扱う組織では、その導入の複雑さが新たな問題となっています。本書 『Platform Engineering on Kubernetes』は、Kubernetes に登場しつつあるベストプラクティスとオープンソースツールを活用し、これらのクラウドネイティブの問題を技術的に組織的にどのように解決するかを示してくれます。 learning.oreilly.com 本書では、Kubernetes上に優れたプラットフォームを構築するための要素を明確に定義し、組織の要件に合わせて必要なツールを体系的に紹介しており、実際の例とコードを交えながら各ステップをわかりやすく説明することで、最終的にはクラウドネイティブなソフトウェアを効率的に提供するための完全なプラットフォーム
トラベルブックのフロントエンドチームでは2020年の9月から、ページのパフォーマンス改善に取り組んでいます。 今回は今までどのようにやってきたのかを紹介したいと思います。 Core Web Vitals 2020年5月、Core Web Vitals がSEOに影響されるというのがGoogleから発表され、集客的にもユーザー体験をページパフォーマンスが重要になりました。 弊社はメディアサービスを運用しており、SEOはビジネス的に重要な指標としています。 そのため、Core Web Vitals をパフォーマンス改善の指標としました。 Core Web Vitalsはより良いユーザー体験を提供するための指標となっていて、読み込み時間、インタラクティブ性、視覚的な安定性 に焦点をあてた下記3つの指標をベースに計測します。 Largest Contentful Paint (最大視覚コンテンツの
Build smaller, faster, and more secure desktop applications with a web frontend | Tauri Apps
Build an optimized, secure, and frontend-independent application for multi-platform deployment.
これはなにか cloudflare スタックを使ったマイクロフロントエンドの提案。 特に service-binding を活用することで異なるサービス(ここでは cloudflare worker)から配信されるフロントエンドを統一的にSSRしつつ、開発単位を分離している。 RTT最適化のために qwik で書かれているが、SSR を意識しなければ他のライブラリを採用しても良い。 $ tree . -I node_modules . ├── README.md ├── body │ ├── package.json │ ├── public │ │ └── favicon.ico │ ├── src │ │ ├── Body.css │ │ ├── entry.ssr.tsx │ │ └── root.tsx │ ├── tsconfig.json │ ├── vite.config.t
フロントエンドでフロントエンドをビルドする
エンジニアの mizchi です。本記事は plaid advent calendar の 8日目になります。 フロントエンドに携わる人なら、フロントエンド開発にまつわるものは、ブラウザの中で開発が完結するはずだ、と考えたことがないでしょうか。僕は個人的にブラウザ上で開発が完結すべきであって、技術的にも不可能ではない、と思っています。これは開発環境と実行環境が同じであるべきという アラン・ケイ
書き始める とりあえずチュートリアルを一周しました。 https://github.com/k1LoW/ndiag/blob/main/docs/tutorial.ja.md チュートリアルの順に、nodesを書いてみてndiag doc --rm-dist、networksを書いてndiag ...、relationsを書いて以下略、とするのが良さそうです。 アイコンのキーはndiag list iconsで表示できるので、これを見ながらndiag.ymlに書き込んでいきます。 VSCode ExtensionsでMarkdown Preview Enhancedをインストール。 Previewを見ながらndiag.ymlを書いては生成、書いては生成します。 とりあえず --- name: Sample AWS web service docPath: docs/arch views:
こんにちは。歴１０年のアプリエンジニア（Best of AppStore🏅受賞歴あり）です。 neeboor🗯という位置情報を使った新しいSNSアプリを作りました。 toC向け＆コンテンツ系＆モバイルアプリというサービスの特性上、最初からある程度高い完成度のサービスを提供しないとユーザーの手に取ってもらえないなと思い、UI/UX中心にかなりこだわって開発した結果、開発に２年以上かかってしまいました。 今回はサービスの紹介をしつつ、開発で苦労した点や工数をかけた点について記事にしたいと思います。 サービスの紹介 neeboor🗯は、「あなたの生活圏をもっとおもしろくするSNS (Make your living area hackable)」というコンセプトの位置情報系SNSアプリです。従来のローカル系サービス（＝地域情報サイト、半径◯メートルでお店や友達探す系、出会い系、ナビ系、トラ
はじめに この記事では、VST（オーディオプラグインの形式の一つ）開発に突如現れた、 React-JUCEという黒船について紹介します VSTとは DAW(Digital Audio Workstation)と呼ばれる音楽制作ソフトウェアでは、VSTと呼ばれるプラグインの仕組みが標準的に用いられています。 VST形式で開発すると、CubaseやロジックといったDAW上でMIDIやオーディオを処理するプラグインを動作させることができます。 VSTの開発においては、JUCE と呼ばれるフレームワークを用いてC++で開発されることが多いようです。 今までのVST開発のツライところ 音楽家でありエンジニアである筆者は、 ずっと興味がありつつも、VST開発からこれまで一定の距離をおいてきました。 その理由としては、 C++こわい 信号処理こわい UIを命令的に記述したくない（※後述します） という理
■ WSLの代わりにDockerを使う 自宅で仕事をするようになって、さすがにWSLのI/Oの遅さに嫌気が差してきた今日このごろ。 世間的にはWindows10 2004*1のWSL2がたいへん評判が良くて、おれもはやく移行したいんだけど、2004にまだけっこう致命的なバグがあって、関係するデバイスを持つうちのPCにはまだ当てられそうにない。PCも古いので買い換える予定なんだけど、まだ機種選定中なものだから、WSL2までのつなぎとして、同じHyper-V上の仮想環境であるDockerをWSLの代わりに使うことにした。 といってもやったことはそんなに難しくはない。ちょっとした自作ツールはだいたいRubyで書いてあるので、ベースにするイメージを「ruby:2」にしてDockerfileを書く。rubyの公式イメージは使い慣れたdebianをベースにしているので都合がいい: FROM ruby:
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
異動先の開発チームに高速で適応する技術 - SMARTCAMP Engineer Blog
【LINE証券 FrontEnd】Recoilを使って安全快適な状態管理を手に入れた話
既存プロダクトに最小構成でTypeScriptを導入する - RAKSUL TechBlog
Design Systemへの取り組み 〜Frontend編〜 | メルカリエンジニアリング
クックパッド株式会社を退職して、LINE株式会社に入社しました - 5.1さらうどん
流行りのBFFアーキテクチャとは？｜Offers Tech Blog
Web開発を補助する目的でPuppeteerを使う - BASEプロダクトチームブログ
フロントエンドカンファレンス福岡 2019 登壇資料まとめ - Qiita
なぜGraphQLを採用するべきなのか、あるいはなぜ採用するべきではないのか 2021冬
RubyとWebAssemblyの関係についてわかる範囲でまとめる | うなすけとあれこれ
The State of Frontend 2022
2022年にWebブラウザに実装された気になる機能を実装例とともに紹介
DevTools の Web 技術でできている部分を覗き見る - polamjaggy
【LINE証券 FrontEnd】コンポーネントをカスタムフックで提供してみた
サービスメッシュ必読ガイド - マイクロサービス時代のサービス間通信管理
Lighthouseの点数を50点以上改善したお話 – TravelBook Tech Blog
cloudflare の better micro frontend を読む
ndiagでAWSのアーキテクチャドキュメントを書く
２年かけて個人で全く新しいSNSアプリを作ったお話し - Qiita
Reactでオーディオプラグインを作れる時代になったという話
WSLの代わりにDockerを使う - ただのにっき(2020-07-23)