【CICD2021】デプロイメントパイプラインの原理原則を再確認する / Confirm Deployment Pipeline Principle
【CICD2021】デプロイメントパイプラインの原理原則を再確認する / Confirm Deployment Pipeline Principle
基本思想 とにかく薄く。必要なものだけ。基本は ts-loader を transpileOnly: true で使うだけ。最悪これだけでいい。型チェックはIDEか yarn tsc -p . --noEmit でやる。 CRA や parcel は使わない。暗黙な振る舞いが多すぎるので。一切勉強したくない人はいれていいと思うが、その場合 eject しない、dist ディレクトリをそのまま使うこと前提。 style-loader/css-loader は外部CSSを読むときに設定する worker-plugin はなくてもいいけど、 worker もビルドしたいことが多いので、入れていることが多い html-webpack-plugin と webpack-dev-server 組み合わせると、他と組み合わせずに完結して動く。このHTMLを本番で使わずとも、デバッグで使ってることが多いの
back check 事業部に業務委託でコミットしているフロントエンドエンジニアの potato4d です。 ROXX では、 v1.0 が出る前から、プロダクト、コーポレートサイト、ランディングページ、メディアなど、多くのシーンにて、 Nuxt.js が採用されています。 Nuxt.js は多くの人に愛される一方で、最近は Vue 3.0 の話もあり、多少評価が落ち着いてきた印象があります。 この記事では、十分に普及した今だからこそ、 Nuxt.js の本当の優位性と、どういったときに使うべきか。あるいは使うべきでないかを再度言語化できればと思います。 「SSRとルールだけ」という勘違い まずは Nuxt.js の採用についてです。多くの場合、「Vue か Nuxt か」という問いには、いかが判断基準として使われます。 SSR 今必要かどうか Nuxt.js の組み込みのルールをチームに
2020.02.27 Rails 6: Docker/docker-compose/dipで`rails new`力を取り戻す こんにちは、hachi8833です。いつからrails newが面倒になってきたのでしょう。 小さめのアプリケーションをスクラッチで書くことをrails new力と呼んでるけど、保守や負債解消や機能追加だけやってると、めちゃくちゃこの力が衰える。くだらないアプリをいっぱい作らないとなーって思った。 — 鶏胸肉 (@yoshi_hirano) October 27, 2019 rails new力が少しずつ返ってきた。これ定期的にやらないとだめだな。 — 鶏胸肉 (@yoshi_hirano) October 26, 2019 私の場合rails newする機会が多いので、Evil Martians流のDocker開発環境構築の次の段階として、自分用にDocker環
以下古い情報です この記事は2018年3月に書かれた記事で、Laravel5.4をベースに記載しています。 (執筆時点では2020年4月ですが)今からこの手順通りにはできませんので、こちらの記事に移動してください。 Laravel7からVue.jsを使う最短レシピ - Qiita Laravel から最短でVue.jsを使う インストールから動かして本番投入まで一通りっていうのが見つからなかったのでまとめてみる。 知らないとわかんないよそんなの!みたいな罠がそこかしこに。 TL;DR bladeテンプレートの修正とコマンドをいくつか実行すれば使える bladeのいじるとこ クローンしたら割りといい感じになるリポジトリつくった fruitriin/laravel-vue-example 今回の環境 macOS High Sierra PHP 7.2 (composerがインストールされている
Laravle6.x/7.xのログイン実装コマンドの違いを見る みなさんこんにちは ジーズアカデミー学校長 山崎ですm(_ _)m 今回はLaravel7にアップデートされLogin画面作成(laravel/ui)を前バージョン同様で使用したい場合 の方法をMemoしておきます(初めてLaravel触る人はこっちが良いかも、、敷居が低い)。 ◆「Laravel8/jetstreamの人はこちらのリンク」 https://qiita.com/daisu_yamazaki/items/607ea579a374c4187562 ◆【Laravel8.x のLOGIN(Breaze)動画も用意してます!】 https://youtu.be/XXXQOYnsCBk 前提条件/検証環境 LaravelでCRUDを作成した経験がある人 Laravelの基本を理解している人 記事内容的には、Laravel
この記事はコネヒト Advent Calendar 2019の11日目の記事です! qiita.com はじめに 半年ほど前から新規事業のチームで仕事するようになり、主な技術スタックもPHPからGo, Next.jsへと変わりました。 その中で、特にフロントエンドのテスト周りにおいてキャッチアップ不足を感じていたのですが、たまたま見つけた*1「Full Stack Open 2019」という教材がとても良かったので紹介したいと思います。 「Full Stack Open 2019」とは fullstackopen.com フィンランドのヘルシンキ大学で実際に使われているテキストベースのオンライン教材です。 Nodeで作られたREST APIとReactを使ったSPAの実装を通して、React・Redux・Node.js・MongoDB・GraphQLが一度に学べる教材となっています。 教材
RustでもWebAssembly出力ができるようになっているんですが、いつか触ろうと思いつつずっと触る機会がありませんでした。 ちょうど自身の周りでもElectronの利用事案が増えて来て(例えばPostludium/Peridotでパイプラインの設計エディタのためにElectron使おうと思ったこともありました......)、良い機会なので入門として件名のライブラリを触ってみることにしました。 Kaguraとは Rust製のWebフロントエンドフレームワークです。端的に言ってしまえばReactやVueなどの仲間です。 仮想DOMを用いて差分レンダリングを行う点は既存のフレームワーク同様ですが、アーキテクチャ的にはHalogenやElmが近いです (いわゆるTEAの形をとっています)。 RustでWebAssemblyを出力する、動かす Rustにはwasm-bindgenという便利ツー
Node.js徹底攻略 ─ ヤフーのノウハウに学ぶ、パフォーマンス劣化やコールバック地獄との戦い方 Node.jsをうまく活用できている企業は、どのような方法でベストプラクティスを習得してきたのでしょうか。ヤフー株式会社でNode.jsの社内普及に務めてきた言語サポートチームに、同社の実施を紹介してもらいました。 Node.jsは「イベントループモデルで、ノンブロッキングI/Oを使用している」「問題発生時にHTTP/TCPやPOSIX APIなど低レイヤーの知識を求められる」といった特徴を持つ言語です。開発者が習得すべき技術領域が広いため、Node.jsらしい書き方の学習難易度は高いと言えます。 それでは、Node.jsをうまく活用できている企業は、どのような方法でNode.jsのベストプラクティスを習得してきたのでしょうか。ヤフー株式会社でNode.jsの社内普及に務めてきた言語サポート
もじゃ(@s10akir)です。paizaラーニングでプログラミング学習動画制作のアルバイトをしている専門学生です。 以前こんな記事を書かせていただきました。 paiza.hatenablog.com 今回は、VSCodeとDockerを使って簡単に開発環境を構築する方法について書いてみたいと思います。 code.visualstudio.com ちなみに前回はプレビューリリースされた「Remote Development with VSCode」と「PaizaCloud」を使って、面倒な環境構築なしで快適に開発しようぜという記事だったのですが、しばらくして「Remote Development with VSCode」が正式版のVSCodeでも使えるようになりましたね!わざわざInsider版のVSCodeを入れなくてもよくなりましたね。 前提の環境について この記事の内容が試せるのは
最近JavaScript関連の開発で採用が進んでいる「webpack」は、JavaScriptファイルの変換や結合といった操作をコマンド1つで実行できるツールだ。本記事では、webpackとは何かという基本的な概念から導入方法、実際の利用例などを紹介する。 モジュール管理機構の不足や未サポート機能の問題をツールで解決する「webpack」 今日のWeb開発においてJavaScriptの利用は避けることができないが、JavaScriptのソースコードをどのように管理・デプロイすべきかという問題に対しては、まだ決定的な解決策が生まれていない状況が続いている。その根本的な原因の1つには、最近までJavaScriptにおいて普遍的に利用できるモジュール管理システムが存在しなかったことがある。 一般的なプログラミング言語では、大規模なプログラムを実装する際に作業性やメンテナンス性を高めるためプログラ
TypeScript再入門 ― 「がんばらないTypeScript」で、JavaScriptを“柔らかい”静的型付き言語に JavaScriptプロジェクトでTypeScriptを導入する際には、“柔らかい”静的型付き言語とするのがおすすめです。藤吾郎(gfx)さんがまとめた「がんばらないTypeScript」のガイドラインです。 TypeScriptは、すべてのJavaScriptプロジェクトで採用する価値のある技術です。TypeScriptとこれに対応したエディタを導入することで、補完や型ベースの整合性のチェックにより、すべてのプロジェクトで生産性が上がります。またリファクタリングも容易になるので、長期あるいは大規模なプロジェクトでも品質を保ちやすくなります。 この記事では、TypeScriptについて最低限の知識とともに、サクッと(どちらかというと既存のプロジェクトに)導入するための
@kawasako が @potato4d に UIT コミュニティで使い始めた OSS の Wiki 「Crowi」について聞いてみました。 Crowi とは https://site.crowi.wiki/ メルカリの sotarok さんが開発した OSS の Wiki システム メルカリ社内のナレッジベースとして実際に利用事例あり モダンで親切な OSS システム Markdown で書ける Heroku Button ですぐに運用を始められる 全体的な雰囲気がモダン 技術的にもフロントエンドエンジニアにとって面白そうなもの Crowi の使いドコロ コミュニティだと使いやすそう コミュニティは SaaS 利用が大変 誰が予算もつ? 管理体制は? Crowi だと立てやすい 他のツールと比較しての利点 開発者コミュニティにとって Markdown は優しい パスベースのドキュメント
package.jsonのdependenciesとdevDependenciesの使い分けについて、いまさらですがまとめます。 dependenciesとdevDependenciesの違い 例えば、sampleという名前のパッケージを開発しているとします。 dependenciesにはrequest、devDependenciesにはmochaが書かれているとします。 { "name": "sample", "dependencies": { "request": "^2.81.0" }, "devDependencies": { "mocha": "^3.4.2" } } //このほかの要素は省略します 開発者がpackage.jsonがあるディレクトリでnpm installを行うと、dependenciesに書かれているパッケージもdevDependenciesに書かれているパッ
メルカリWeb版のUIテスト自動化で目指している世界と、そのために作った Selenium Grid・Zalenium 環境 on Azure Kubernetes Service(AKS) メルカリの自動化&品質保証グループ(Automation & QA Group:通称AQA)の 根本 征 です。 私は普段、テスト自動化・CI / CD 改善・その他社内の生産性を上げるための自動化を行っています。 今回は、最近私たちが行なっているメルカリWeb版のUIテスト自動化と、その自動テスト環境についてご紹介したいと思います。 メルカリWeb版のUIテスト自動化について UI自動テスト環境に関する課題 Selenium Grid を Azure Kubernetes Service(AKS) 上で構築する Zaleniumを試す Azure Kubernetes Service(AKS)で受け
はじめに 文章を書くときに、注意して半角文字の両端に半角空白を空けるという手動 lint をよくやっています。 また、日本語の表現や句読点、typo などに注意を払うことも必要です。 そこで、機械的に検出できた方が内容を書くことに集中できるので文章の lint ができる textlint というツールを使っていきます。 同様の検査ツールとして RedPen が存在します。 以下の記事に RedPen と textlint それぞれの立場から文章における問題とその解決についてまとまっているので参考になります。 文書執筆の指南書で解説されている問題点を RedPen で発見する - Qiita 文書執筆の指南書で解説されている問題点を textlint で発見する - Qiita 今回は、リポジトリ内で管理する Markdown ファイルに対して、Visual Studio Code(VS C
Node.js、React、TypeScriptをはじめ、HTML、CSS、Sass、Markdownなどが利用できるWeb開発用のサーバーが秒速で簡単に構築できるZero Serverを紹介します。 必要な依存関係は自動インストールされ、ReactやSassは置くだけでコンパイル、マークダウンも設定は一切不要です。サーバーを構築する時間が無い人、設定に明るくない人でもすぐに利用できます。 Zero Server Zero Server -GitHub Zero Serverの特徴 Zero Serverのインストール Zero Serverの使い方 Zero Serverの特徴 Zeroは現代のWeb開発をシンプルにするためのNode.jsフレームワークです。パッケージマネージャーやルーティングを気にせずにアプリケーションを構築できます。 Node.js、React、HTML、MDX、静
Gatsbyとは Reactを使った静的サイト生成ツール static PWA(Progressive Web Application)を作れるらしい。PWAとはネイティブアプリのようなWEBアプリと自分は解釈している。 Reactのことをさっぱり分かっていないこともあり、学習も兼ねて使ってみた。 静的サイト生成ツールはこちらの一覧が参考になった。 markdownを書いてblog記事にするためのhow to 1. インストールと設定 gatsby-plugin-react-helmetが2系だと、$ gatsby developでエラー出てたけどもう直ってるかも? $ node -v v9.3.0 $ npm install -g gatsby-cli $ gatsby new my-blog $ cd my-blog $ npm install gatsby-source-filesy
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く