SREって何？ これまでのシステム運用やDevOpsとは何が違うの？
近年、何かと話題に上がるSRE（Site Reliability Engineering）。しかし、「自分たちのチーム・組織に関係する話なのかよく分からない」「具体的に何をやればいいの？」といった感想を持つ方は多いのではないでしょうか。本連載では、そういった方に向けて、自社でSREチームの立ち上げを行った筆者が、SREの考え方 をご紹介します。また、連載の後半では、SREをいち早く取り入れた企業に導入背景などもインタビュー形式でお伝えする予定です。第一回となる本記事では、「SREって何？」「SREをやりたいが、どこからはじめればよいのか分からない」 方に向けて、SREの概観をご紹介します。 はじめに はじめまして。株式会社スタディスト SREチームの@katsuhisa__です。 スタディストでは、システム運用に関わる全般的な業務にはじまり、モニタリングやログ収集基盤の整備などを担当してい
Vue.jsの世代交代が到来！ Vue 3デフォルト時代の「Vue.js開発新常識」
本連載では、JavaScriptフレームワーク「Vue.js」を、型定義が利用できるようJavaScriptを拡張した言語「TypeScript」で活用する方法を、順を追って説明していきます。前回はVue.jsでコーディングするための基本的な記法を説明しました。今回はVue.jsの公式ブログから発信された「Vue 3をデフォルトバージョンにする」発表と、それに伴って、これまでと変わっていくVue.js開発の新常識を紹介していきます。 はじめに 本連載では、JavaScriptを利用して動的なWebページを構築できるフレームワークVue.jsを、データの型指定ができるように拡張されたAltJS（コンパイルしてJavaScriptにする言語）であるTypeScriptで活用する方法を、順を追って説明しています。 本連載ではVue.jsの最新バージョンとなる「Vue 3」を用いてきましたが、実は
高速で開発者体験も抜群！JavaScriptフレームワークの新星「Svelte」とは何か？
はじめに 本記事では、ユーザーインターフェイスを構築するためのJavaScriptフレームワークのひとつ「Svelte（スベルト）」についてご紹介します。 Webフロントエンドの領域は年々大きくなっており、読者の皆さまの中でもReactやVueといったフレームワークを使ったことがある方が多いものと思います。もしかしたら、Svelteの名前もどこかでご覧になり、気になっている方もいるかもしれません。 Svelteは、そのアプローチの新しさから注目されはじめています。 JavaScript のライブラリに関する大規模調査「State of JS 2020」で「最も愛されているWebフレームワーク」「もっとも開発者の満足度の高いフレームワーク」に選ばれたことでも話題となりました。 そこで本記事では、ReactやVueに少しでも触れたことがある方を想定して、それらと比較する形で、Svelteの特徴
新Vue.js「Vue 3」でコンポーネント実装法を大きく変える「Composition API」
はじめに Vue.jsは、Webページのユーザーインタフェース（UI）を構築できるフレームワークです。2015年のバージョン1（Vue 1）、2016年のバージョン2（Vue 2）に続き、バージョン3（Vue 3）が開発中で、2020年第2四半期にリリース予定です。 本記事では、全2回にわたって、Vue 3の新機能を紹介していきます。今回は、Vue 3で導入されるコンポーネントの新しい記述形式「Composition API」を説明していきます。 対象読者 Vue 3の概要を把握したい方 新しいライブラリーを試してみたい方 これからVue.jsをプロジェクトに採用する予定の方 必要な環境の準備 本記事のサンプルコードは、以下の環境で動作を確認しています。 Windows 10 64bit版 Node.js v10.18.1 64bit版 Vue.js 3.0.0-beta.15 Vue C
「Docker Desktop 2.2」がリリース、WSL 2が利用可能なプレビュー版も
「Docker Desktop 2.2」では、これまでSambaに依存していたDocker上で動作するLinuxファイルシステムとWindowsファイルシステムの相互管理をgRPC FUSEに置き換えている。 gRPC FUSEへの置き換えによって、キャッシュを利用してページ読み込み時間を短縮するとともに、Linux inotifyイベントをサポートし、ソースコードが変更されたときに自動再コンパイル／リロードのトリガーが可能になったほか、Windows認証とは切り離して利用できるようになった。また、VPNの接続／切断にかかわらず利用可能で、管理者として実行されるコード量を削減している。 さらに、ローカルで実行中のコンテナと、Composeアプリケーションを管理できるインタラクティブなダッシュボードUIが採用された。WindowsとmacOSで共通のインターフェースを実現する、新たなデスクト
誰でも簡単にできる！ LINE Botの作り方
本連載では、今後広がっていくであろうbotの開発手法を、LINE Botを例として解説していきます。開発はPHP、サーバーはHerokuのフリーアカウントを利用するので簡単に、そして無料で運用が可能です。第1回はMac／Windowsの方に向けた開発環境の構築方法の解説、Herokuのアカウントの作り方とデプロイ方法、LINE Business Centerでのアカウント開設とbotの作成、それをHerokuにひも付けて、botからのリクエストをHerokuにデプロイしたプロジェクトが処理できるようになるところまで解説します。最後に完成済みのプロジェクトをダウンロードしてデプロイし、LINEアプリからbotにリクエストを送り実際に動くところを見てみましょう。 LINE Bot Awardsエントリー受付中！（2017年2月22日まで） グランプリ賞金1000万円のLINE Bot Awar
HTML5でクロスプラットフォームなデスクトップアプリを開発できる「Electron」とは
Electron（旧Atom-Shell）とは、Web開発者がHTML5とNode.jsでMac、Windows、Linuxのデスクトップアプリを作れるクロスプラットフォーム実行環境です。Electronはオープンソースで無料で使える上に、MITライセンスであるため、商用利用も可能です。開発元はGitHub社です。 最近はJavaScript、HTML5の進化によって、多機能なWebアプリケーションが増えてきました。それに伴い、モバイルでは、WebViewやApache Cordovaなどを使ったハイブリッドアプリも注目されています。Electronはその流れの中から生まれた新しい実行環境です。 ElectronはChromiumブラウザを内蔵しているのが一番の特徴です。Chromiumブラウザは、Google製のChromeブラウザのオープンソース版にあたります。ウェブ開発者がChrom
誰でも無償で利用可能になった、ゲームエンジン「Unreal Engine 4」入門 ～概要とゲーム作りのはじめの一歩
はじめに ここ最近、Unreal Engine 4（以下、UE4）というゲームエンジンの名前を、ゲーム開発系の記事などで目にする機会が増えてきました。最近では、ストリートファイターVや鉄拳7などの有名格闘ゲームのゲームエンジンとして採用されたというプレスリリースも記憶に新しいところです。 このようにプロが利用するUE4ですが、法人のみならず個人でも利用できます。つまり、みなさんが遊んでいるゲームの開発環境と全く同じ環境で、個人がゲーム制作できるのです。このようなことは、以前では到底考えられませんでした。 ここでは、UE4の特徴や、ゲームの作成方法、その後の学習方法までを解説していきます。なお、ここでは、Windows版のUnreal Engine 4.7.3をベースに解説します。 対象読者 3Dゲームを開発してみたい方 3Dグラフィックスを簡単に構築してみたい方 Unreal Engine
お手軽データバインディングライブラリ「Vue.js」を使いこなそう（コンポーネント編）
はじめに 連載第1回目記事『お手軽データバインディングライブラリ「Vue.js」を使いこなそう（基礎編）』ではVue.jsの基本について解説しました。今回はVue.jsを使用して再利用可能なモジュールを作るための技術要素、カスタムフィルター、カスタムディレクティブ、コンポーネントについて紹介します（本稿の執筆時点のVue.jsのバージョンはv0.11.5です）。 Vue.jsはVM（ViewModel）インスタンスを定義することにより、View-Model間の双方向データバインディングを容易に実現する機能を提供するライブラリです。シンプルな機能で学習コストが少ないという特徴もあり、お手軽にアプリケーション開発を進めることができます。しかし、次第にアプリケーションの機能要件が多くなってくると、VMインスタンスの定義だけでは$elや$dataの内容が肥大化して煩雑になってしまう場合もあります。
お手軽データバインディングライブラリ「Vue.js」を使いこなそう（基礎編）
はじめに Vue.jsは、シンプル・軽量・高速という特徴を持つデータバインディングライブラリとして最近注目を集めています。LINE社でもアプリ内WebViewの実装技術の選択肢の一つとしてVue.jsを採用しています。2014年11月27日にリリースされたLINEスケジュールは、Vue.jsを使って実装しているSPA（Single Page Application）の代表例です。 本稿は日本語記事がまだ少ないVue.jsの基本機能の紹介を目的とした「基礎編」として、公式ドキュメントの内容を元に解説します（執筆時点のバージョンであるv0.11の内容です）。 Vue.jsとは Vue.jsは、双方向バインディングによるModelとViewをつなぐ仕組み「ViewModelレイヤー（MVVMパターン）」を提供するJavaScriptのライブラリです。 Vue.jsの基本概念は以下のようになってい
いま最も注目のライブラリ「React.js」でシングルページアプリケーションを作ってみよう！ 【前編】
対象読者 JavaScriptフレームワーク・ライブラリの選定に悩んでいる方 本格的にJavaScriptを触るのが初めてという方 jQueryでの大規模なフロントエンド開発に限界を感じている方 必要な環境 Node.jsがインストールされていることが推奨です。 React.jsとは何か React.jsは最近注目を浴びているFacebook製のライブラリで、MVCアーキテクチャでいうViewにあたる機能を提供します。 前提として、JavaScriptの世界でMVCのVといえば、紛れもなくDOM（Document Object Model）のことを指します。特に何も意識しないで作った場合、都合の良いDOMからデータを引っ張り出しては別のDOMを書き換えるといった、行き当たりばったりな作りになりがちです。そこで、MVCの考え方を導入することにより、データを画面とは独立した構造体として切り出し
AngularJSでMVCプログラミングをはじめよう
対象読者 jQueryなどを使っているJavaScript開発者 JavaScriptを使った複数人でのプロジェクトに参加している方 JavaScriptを使ってサーバ等と連携したフロントエンドの開発をしている方 必要な環境 この記事では、AngularJSを使用し、Chrome（36.0）、IE11、Firefox（31.0）、Safari（7.0.5）の環境で確認を行っています。 サンプルアプリケーションの概要 今回作成するアプリケーションは、単純な「タスク管理」のアプリケーションです。次のような3つの画面を作ります。 タスク（件名とメモ）を登録する画面 登録したタスク一覧を表示する画面 登録したタスクを参照する画面と、削除する為の画面 ページ遷移はシングルページアプリケーション形式で作成します。シングルページアプリケーションとは、jQuery Mobileなどでも使われている方式であ
JavaScriptのテストコードをNode.js＋Jasmineで実行してみよう
対象読者 JavaScriptの基本をある程度理解している方 テストコードをこれから書こうと考えている方 Jasmineとは Jasmineとは、JavaScriptのテスティングフレームワークです。Mochaなどのテスティングフレームワークとは違い、値を評価するためのアサーションモジュールも内包されています。また、CoffeeScriptでの記述も可能です。 Jasmineは振る舞い駆動（BDD）の形式でテストを記述します。BDDは、作成する機能に期待する「振る舞い」を文章で記述していきます。言い換えると、顧客が望んでいるであろう「要求仕様」に近い形でテストを表現しながら、テストと実装を記述していく手法です。 リスト01は、Jasmineで記述した基本的なテストコードです。このコードを文章として日本語に直訳すると「【処理結果】が【期待する値】と同じでないと予測（expect）する」です。
さよなら手作業・人海戦術！ HTML5時代のツール「Selenium2」でWebシステムのテストを自動化
本シリーズは、WebブラウザをUIとして利用した業務システムやアプリケーション（以下、Webシステム、Webアプリケーション）のテストをテーマとして、Webブラウザを使ったテストを自動化するOSSのツール「Selenium2」を紹介します。業務システム開発の現場で適用してきたノウハウを元に、これまでSelenium2について知らなかった人から以前使った経験がある人まで、より実践的な「使える」内容を盛り込んでいきたいと思います。 本シリーズのスコープと対象読者 本シリーズはWebシステム・Webアプリケーションのテストの中でも「Webブラウザを操作して実施するテスト」をスコープにしています。開発工程としては、1モジュールとして単体テストに位置付けられる場合もあれば、複数のモジュールやシステムと連携して結合テストや総合テストに位置付けられる場合もあるでしょう。これらのテストのことを、本シリーズ
「Selenium2」のインストール手順と初めの一歩
対象読者と環境 Webブラウザを使ったテストを自動化するOSSのツール「Selenium2（WebDriver）」のインストール手順と基本的な使い方をご紹介します。想定読者は、テスト自動化に興味のあるプログラマーです。 SeleniumにはSelenium IDEというブラウザ操作を記録できるツールがあり、SeleneseというSelenium1に対応したコマンドをHTML形式で保存します。これによってノンコーディングでテストスクリプトを作成することができるのですが、WebDriverやプログラミングによる効率化の恩恵を受けることができません。本記事はSelenium IDEを活用しながらWebDriver使ったテストスクリプトをJava（JUnit）形式で書いていくための手引きとなっています。 今回筆者が使用した環境は以下のとおりです。 OS：Windows 7 Java：1.7 Fir
Xcode×PhoneGapでiOSアプリ開発！ ～インストールからアプリ実行まで
はじめに Xcodeは、OS XおよびiOSアプリケーションの開発用にAppleが提供している統合開発環境（IDE）です。iOSは、iPhone、iPadおよびiPod touch用のAppleのモバイルオペレーティングシステムです。 PhoneGapは、ネイティブにインストールできるモバイルアプリケーションをHTMLおよびJavaScriptで作成するためのオープンソースのアプリケーションプラットフォームで、Apache Cordovaとも呼ばれます。 Xcodeをセットアップする PhoneGapアプリケーションを開発するためにXcodeをセットアップするには、まずAppleのXcode IDEをダンロードしてインストールします。Xcodeは、Apple のデベロッパーサイトでダウンロードできます。Xcodeをダウンロードする前に、Appleのデベロッパーとして登録する必要があります。
【デブサミ2014】14-A-4 レポート Office開発の大改革 ～ ウォーターフォールからアジャイル開発へ
Microsoft Officeは長年、ウォーターフォール型のプロセスで開発されてきた。プランニングが始まり、End-to-Endで実際に動くものが見られるのに約1年。そこから外にリリースされるまでにもう1年という流れだ。20年の経験があることから、工数の見積もりなどは極めて正確で、スケジュール管理やツールも安定。基本的にデベロッパーにとって無理のない開発が実現されていた。 しかし、いくら効率よく開発できたとしても、プランニングの段階で間違っていたり、開発中に環境が変わってしまったりした場合、開発したものが無駄になることがある。特に近年、次々と新しいプラットフォームやデバイスが出現しており、そのリスクが高くなっている。 そうした環境の変化は当然、Officeチームのリーダーの間でも認識されていた。そこで、次世代Officeプランニングの時期から新方針を検討。次のような方針を打ち出した。 こ
なぜJavaScriptでテストコードを書くのか？
はじめに 第1回目の本稿は、実際にテストコードを書く前に、基本的な考え方である「なぜテストコードを書くのか？」を解説します。 対象読者 JavaScriptの基本をある程度理解している方 テストコードをこれから書こうと考えている方 頻繁な変化への対応 まずは、開発現場で多く行われている基本的な考え方を振り返り、テストコードがなぜ必要なのかを考えて行きたいと思います。 これまでのテストの考え方 まずは、一般的なウォータフォールモデルを例に考えてみましょう。通常ウォータフォールモデルでは、設計→実装→テストという順番で、作ったものを最後にテストします。最後にテストを行うというのは、言い換えると「品質を最後に担保する」と言えます。 また、最後にテストする場合は、通常テスト仕様書などを作成した上で必要なテストパターンを洗い出し、手動でテストを実施します。 変化への対応が求められている スタートアッ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「Vue.js」でWebページを作成できるフレームワーク「Nuxt.js」最初の一歩
【制作1日目】 池澤あやかさん、イベント会場がヒートアップ間違いなしのアプリを制作、まずはクライアント側処理です ～ Amazon S3 / Cognito / Kinesis / DynamoDB 登場
