社内の2017新卒向けブートキャンプ ( 研修 ) にて使用したスライド資料ですが、せっかくなので一般公開します。

そんなことができるのか? A. できるようになりました。(以前からできていたんだろうと思われるが…) Google Developer Relations Teamのblogでローカルで開発するための環境構築についての記事が投稿されました。 Apps Scriptによる高度な開発プロセス ということで、早速(でもないですけど…)試してみました。 環境構築 node.jsをインストールする。 私はnodebrewを使っているので、参考記事をおいておきます。 http://qiita.com/sinmetal/items/154e81823f386279b33c バージョンはv0.12.x以降なら動作するようです。 node-google-apps-scriptをインストールする。 エラーが出なければOK Apps Scriptのプロジェクトを作る。 最初に、Google Driveの任意のフ
おはこんばんちは!! 尾藤 a.k.a. BTOです。 UUUMでは業務の効率改善に kintone を導入しようとしているのですが、kintone の機能を拡張するには Javascript でプログラムを書く必要があります。 そこで、Javascript の開発環境を構築したので、何をやったのかをまとめてみました。 具体的には、 BabelでES6で書いて、webpackでビルドして、mochaでテスト書いて、power-assertでassertの出力を見やすくして、karmaで複数ブラウザのテストを自動化して、カバレッジを出力するようにしました。 お前は何を言っているんだと思うかもしれませんが、僕も何を言っているのかわかりません。 Babel 言わずと知れた ES6 用のトランスパイルツールです。 ご存知の方も多いと思うので、詳細は割愛しますね。 Babel の導入は npm でイ
お前は今更何を言ってるんだ?というテーマですが整理するために。 Google App Script(以下GAS)とはjavascriptでGoogle App(今ではG suite?)の豊富な機能を堪能でき、ある程度の作業を自動化することができます。しかも無料で!指定時間に勝手にスクリプトを起動することもできちゃいます。 例えば、複数のcsvをDriveにアップしてボタンをポチっとするだけで目的のデータが揃い、そのデータをメールで飛ばしたりできるのは非常にありがたいです。 導入する環境 環境を整える npmとgitの初期化 babel gulpまわり browserify テストツール eslint ファイル構成 gulpfileの作成 お疲れさまでした 開発する 雑談 導入する環境 このGASの機能をもっと使いこなしたい。具体的には npmで管理 es6 gulp browserifyで
We're excited to announce that ESLint v6.0.0 has been released: https://t.co/EO4ZrZIMYM — ESLint (@geteslint) 2019年6月22日 ESLint は JavaScript のための静的検証ツールです。コードを実行する前に明らかなバグを見つけたり、括弧やスペースの使い方などのスタイルを統一したりするのに役立ちます。同様のツールとしては JSLint, JSHint 等があります。 ESLint の特色は、 すべての検証ルールを自由に on/off できる 自分のプロジェクトに合わせたカスタムルールを簡単に作れる 豊富なビルトイン ルール (5.0.0 時点で 260 個) に加えて、たくさんのプラグインが公開されている ECMAScript 2015 (ES6), 2016, 201
明けましておめでとうございます、@yoheiMuneです。今年もどうぞ宜しくお願いします。 本年1つ目の記事は、node.jsにおけるモジュール定義についてブログを書きたいと思います。 Special Thanks to https://flic.kr/p/7sQ4oC 目次 node.jsにおけるモジュール定義 node.jsではcommon.jsのモジュールに準拠したモジュール定義を行うことができ、それを別ファイルからrequireメソッドを使って呼び出すことができます。扱いたいことはたったこれだけなのですが、具体例がないと理解しづらいので、具体例を出しつつnode.jsのモジュール定義を学べたらと思います。 その1:exportsに関数を代入する モジュールの定義はオブジェクト型でも関数型でも(時には文字列型でも)行う事ができます。関数を外部に公開する場合には、次のように定義して利用
株式会社Speeeの山本です。皆様、こんにちは! 今回ご紹介させていただくのは、Speeeで実践しているGoogle Apps Script(以下 GAS) を用いたモダンな開発手法についてです。この記事を通してGASって「便利だし使えるかも!」と思っていただければ幸いです。 Google Apps Scriptとは Google Apps Scriptは、言わずと知れたGoogleが提供するサーバサイドのスクリプト環境です。 基本的にはWebブラウザを通して開発を行います。 作業効率化に威力を発揮するGAS Speeeでは特に、管理部門の作業効率化でGASを使用しているケースが多く、例えば Slackの制限付きユーザを各種チャネルに招待するアプリケーション メーリングリストの文面生成を自動化するアプリケーション Speeeラウンジの使用状況を閲覧するアプリケーション など、様々な用途でG
が良いかなーと思っています。 開発環境編 ざっと感覚値を書くと、 あまり複雑でない、小さめなアプリケーションや、ローカルで開発するメリットがあまり感じられない場合 ScriptEditorで作ったほうが良いです。 どうしてもバージョン管理したい、altJSで開発したい、Container Bound Scriptの開発じゃない Eclipseやその他サードパーティツールなどローカルで開発 初めてならやめておいたほうが良い。 ScriptEditor GASの開発環境は通常はScriptEditorになると思います。 僕もよくGoogleのAPIを利用するスクリプトを書く場合はScriptEditor上で開発します。 ScriptEditorでは各種ショートカットがありますので、手前味噌ですがこの記事を見ておくと良いと思います。 Eclipse 統合開発環境として有名なEclipseでもGA
Power Assertとはassert(a === b); のような単純なアサーションでも、 Assert失敗時(テストが通らなかった時)に分かりやすい情報を表示できるようにする機能の事を言います。 JasmineやChaiが持つshouldやexpect等言った豊富なアサーションを覚える必要なく、 シンプルにassert()を使うだけでも十分な失敗時の情報が得られるため、沢山のアサーションを使い分けしなくていいというメリットがあります。 この記事ではPower AssertのJavaScript実装であるtwada/power-assertの使い方について紹介します。 記事を読む前に このNode.js編とブラウザ編で分けるぐらい長い記事となってるので、 お忙しい方は5分ぐらいで分かるpower-assertというスライドもあるので、そちらを読んでざっくり把握してみるのもいいでしょう。
(訳者注: これは、JavaScript Stack from Scratchを翻訳し、まとめて読めるように1ファイルにしたものです。元の翻訳と各種ファイルについては、日本語訳forkリポジトリを参照してください。また、原文が活発に更新されているため、訳文も追従して更新されます。ご了承ください。) ゼロから始めるJavaScript生活 モダンJavaScriptスタックチュートリアル、ゼロから始めるJavaScript生活へようこそ。 ⚠️️ このチュートリアルのメジャーアップデート版を3月初旬に公開する予定です。ご期待下さい! より詳しく(英語). これはJavaScriptスタックを使い始めるための最短最速のガイドです。このガイドは一般的なプログラミングの知識とJavaScriptの基礎を前提としています。これら全てのツールを一緒につなぎ合わせることにフォーカスしており、各ツールにつ
var gulp = require('gulp'); var $ = require('gulp-load-plugins')(); var browserSync = require('browser-sync'); var rimraf = require('rimraf'); var runSequence = require('run-sequence'); gulp.task('jshint', function () { return gulp.src('src/scripts/**/*.js') .pipe($.jshint()) .pipe($.jshint.reporter('jshint-stylish')); }); gulp.task('image', function () { return gulp.src('src/images/**/*') .pipe($
背景 Javascript で Web アプリを作ろうとすると、よくわからないことだらけで超混乱します。 npm と bower の違いは? npm はサーバーサイド用、bower はクライアントサイド用らしいよ えっ、でもなんで bower のインストールに npm が必要なの? サーバーサイドは Rails で書きたいから npm 要らないと思うんだけど・・・ ていうかサーバーサイドJSとか node.js って何? よく見る browserify って何? こういった疑問が沸き上がるのは、各ツールが生まれた文脈がよくわかっていないからです。いろいろ調べてやっとちょっとわかってきたのでメモします。間違いがあったらご指摘ください。 「CommonJS」誕生 - Javascript は汎用プログラミング言語へ その昔、Javascript 大好きおじさんは言いました。 Javascrip
JavaScriptの現状を支えるエコシステム群を軽く紹介して、モジュールについて少し掘り下げた勉強会
お疲れ様です。 思えばKnockoutJS触るようになってからまだ3ヶ月かそこらです。そこまで語れるようなコアな知識に踏み込めるか?というとそこまで探求しきれてはいません。なので初学者向けに何か書けるといいな、と考えました。 KnockoutJSを使おうと思ったきっかけは3ヶ月くらい前、Rebuild.fmで宮川さんがAngularをdisりながら「JavaScript得意な人はKnockoutが薄くていいよ、っていうけどね」と言うのを聞いたことでした。自分も前の仕事でAngularの規模感(というか学習コスト)につらみを感じていたので、新しく開発する前にちょっと触ってみるか、と興味を持ちました。 勉強しはじめて、わりとすぐ新しい開発で導入したのですが、その中で実際に何をしたのかを振り返ると 公式チュートリアルを3周くらいやる Railsにうまいことフィットさせる方法を実装しながら模索 こ
Todoアプリもどきを作る 今回はRequireJSの理解を深めるため、Backbone.jsと組み合わせてTodoを追加するだけの簡素なデモを作ってみました。 Backbone.jsについても触れているため、記事が少し長いです。 お急ぎの方はページ下部にデモとサンプルコードがあるので、そちらをさくっとご確認ください。 RequireJS: http://requirejs.org/ RequireJS API: http://requirejs.org/docs/api.html Backbone.js: http://backbonejs.org/ なにができるの? Webアプリを制作する際に、RequireJSを使ってBackbone.jsで構成されるModelやViewをモジュール化することで、開発時の管理コスト削減を目指します。 なお、モジュール化するとファイル数が増えて読み込み
Vue.js: Revolutionary Front-end #1 http://abeja-innovation-meetup.connpass.com/event/38214/
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く