レガシーシステムの大規模リプレイスで分かった「Vue.jsでSPAならNuxt.jsが有力」 10年以上前に作られたレガシーシステムをVue.jsで大規模リプレイスしたエムスリーに、導入して感じたVue.jsのメリットや、活用法を伺いました。 JavaScript（JS）のフレームワークは、何を使うのがベストなのでしょうか。ここ3年ほどで数々のJSフレームワークが誕生していますが、React、Angularという二大巨塔を超えるものはなかなか現れていません。 そんな状況の中、GitHubではReactを上回るスター数を誇っている1のが、2014年のリリース後、着実に進化を重ね、日本でも採用事例が増えてきているVue.jsです。「JavaScript ベスト・オブ・ザ・イヤー」に2016年、2017年と2年連続で選ばれているほか、Ruby on Rails（Rails）やLaravel とい

なぜ初心者は webpackが解らないのか？- Why can’t you understand the webpack? - from 健人 井関 www.slideshare.net この記事バズってたけど、わからない人がよりわからなくなる、という点で問題だと思っていて、webpack の目的の本質的な部分から整理する必要があると思います。 (あと友人が webpack に挑戦していたので入門資料も兼ねてる) Webpack の本質的な部分は次の3つです。それ以外は全部おまけ機能だと思ってよいです。 ES Modules のエミュレート node_modules のリンカ 拡張子ごとの変形 Webpack が本当にやりたいこと こういうコードがあるとします。 // src/a.js export default () => console.log('hello'); // src/in

どうも、まさとらん（@0310lan）です！ 今回は、環境構築をすること無くブラウザ上から自由にNode.jsを使ったプログラム開発ができるサービスをご紹介します！ 非常に多機能であり、Jupyter Notebookのような記事とコードを混在させたノートブックを作って公開することができます。 使い方次第でサーバーレスな独自APIの構築も可能なので、ご興味のある方はぜひ参考にしてみてください！ 【 RunKit 】 ■「RunKit」の使い方 それでは、最初に「RunKit」の使い方から見ていきましょう！ まずはトップ画面の右上にある「Sign in」ボタンをクリックします。 ログイン画面が表示されるので、その下にある「Sign up」ボタンをクリックしてユーザー登録を済ませておきましょう。 メールアドレス・パスワードなどを入力するだけで完了します！ ※登録したメールアドレス宛に「認証リン

対象読者 JavaScriptとWeb開発の基礎に理解がある方 Reactに興味／関心があり、これから学び始める方 前提環境 筆者の検証環境は以下の通りです。 macOS High Sierra 10.13.3 Node.js v10.4.1／npm 6.1.0 React 16.5.1 firebase-tools 4.2.1 create-next-app 0.5.9 Next.js 6.1.2 Babel 7.0.0 前回作成したプロジェクトを眺めてみる 前回はFirebase Hostingに対応した、Next.jsのプロジェクトを、firebase-ssrという名前で作成しました。 今回はまず、できあがったfirebase-ssrディレクトリの中を見てみましょう。srcディレクトリの中が、少し込み入った構造になっています（図1）。 図1：srcディレクトリの中身 src/app/

やれletを使え、やれconstを使え、と言われているES2015+時代。varがなぜ問題だったのか考えます。 他のC風言語とは違う！ JavaScript(ECMAScript)はC風言語(C-family programming languages)の一つと言われています。List of C-family programming languagesの仲間であり、その中の一つとして数えられています。他にメジャーなものでは、C、C++、Java、C#、Perl、PHPあたりでしょう。PerlとPHPは変数名の規則に違いがある1ので除くとしても、他の言語とJavaScriptとでは変数の取り扱い方に大きな違いがありました。 ブロックスコープでは無い まず、C、C++、Java、C#とES5以前のJavaScriptにはスコープに対する決定的な違いがありました。それはif文やwhile文等のブ

This document discusses using Akka actors and Redis for building a scalable chat server architecture. Key points include: 1) Using Akka actors for the chat room, user, and supervisor actors to handle chat logic and failures in a distributed, asynchronous manner. 2) Storing chat room membership and messages in Redis for real-time updates between actors using pub/sub. 3) The Lettuce client is used t

JavaScriptのArrayを知る。大きな目標への小さな一歩 〜Array.prototype.includes編〜 愛って知ってますか？ ……どうも、フロントエンドエンジニアのザワです。 最近では、胸キュン対象がネコかアルパカになっている私、人を愛する心はあるのかい？ と自分に問いかける毎日です。 さて、Arrayを知るシリーズ3回目ですが、今回のゲストはこちら。 Array.prototype.includes()メソッドです。 includeは「〜を含める」という意味です。英語の意味を把握すると、何をするメソッドなのか予想がつきますよね。きっとあなたが予想しているとおりです。 そう。配列の中に探し求めているものがあるの？ 教えて！ っていうメソッドです。 それでは例文を見ながら、そこに愛はあるのか、一緒に紐解いていきましょう。 ※ ここからの説明は個人的に調べて解釈したざっくりと

どうも、まさとらん（@0310lan）です。 今回は、これからJavaScriptを学習しようという人や、ちょっとしたプロトタイプを開発したい人に向けて、オススメの「オンラインコードエディタ」を厳選してご紹介しようと思います！ 選んだ基準としては…、 SSL対応のWebサービス JavaScriptの実行環境が備わっている 作成した「コード」や「作品」の公開が可能 面倒なログイン不要ですぐに使える 無料で利用できる …などの点を重視しながら、誰でも「ブラウザ」さえあれば今すぐ使えるモノをまとめてみたので、ご興味ある方はぜひ参考にしてみてください！ ■Webページとしても公開できる実用的なエディタ！ 【 PLAYCODE 】 「PLAYCODE」は、まだ新しいサービスですが、JavaScriptプログラミングの学習はもちろんのこと、ちょっとしたプロトタイプの開発に最適なコードエディタと言える