プログラミング初心者のための JavaScript と Node.js の歴史、それを踏まえた勉強方法 2020年でJavaScript学ぶならきっとブラウザ向けJSガン無視していきなり初手node.js（ただし暫く何も足さない）がいいんじゃないかというメモ - min.t (ミント) Node.js を教えることについて、自分は賛成なんですが、その学習パスが整理されてないなと思っていたのと、学習パスがなぜ整理されていないかについて書きます。 はじめに 問題意識として、今のプログラミングスクールや独学勢が Ruby on Rails に偏っていて、 Node.js の人間としては、歯がゆく感じているんですが、実際 Node.js を教えるとしても問題も多いと認識しています。 歴史の話は、当時の実情や政治を省いて結果だけを書きます。具体的には第一次ブラウザ戦争、第二次ブラウザ戦争を言及しませ

ショーヘー@デイトラ代表 | 受講生25,000人突破 @showheyohtaki プログラミング学習中の方へ👨‍💻 これ面白い！！セガがjavascriptでぷよぷよを作るプログラミング講座を出してくれてます😊 動作ごとに細かくコメントも入ってるので、ちゃんとソースコードを読んでから写経していったらめちゃくちゃいいプログラミングの勉強になると思う！ puyo.sega.jp/program_2020/ pic.twitter.com/Xr5hmPzZXI 2022-01-08 18:03:38 ショーヘー@デイトラ代表 | 受講生25,000人突破 @showheyohtaki このぷよ開発に使う『Monaca』は、本来iOS用はswift・Android用はJavaと、別々に開発が必要なアプリを、HTML・jsなどのWeb標準言語でまとめて開発できるという開発プラットフォームで

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

となります。 またNode.jsの特徴として「Webサーバの役割もNode.jsがこなす」という点があります。（というかNode.jsの目的を考えるとWebサーバとしての役割がメインです） 元々Node.jsは大量の同時接続をさばけるようなネットワークアプリケーションを構築することを目的として設計されています。 そのため、Webサーバとしての機能から一貫してNode.jsが受け持ち、効率的に処理できるようになっています。 要するに通常使われるApacheやnginxのようなWebサーバの代わりにNode.jsが直接HTTPリクエストを受け取り、処理をしてくれます。 （実際にはNode.jsのみだとWebサーバとしては少し機能が物足りないので、その前段にApacheやnginxをリバースプロキシとして置く構成が多いです。） 目的3. モバイル/デスクトップ用のアプリケーションを作りたい No

目次 自動セミコロン挿入(Automatic Semilocon Insertion) Restricted Production ASIの害 セミコロンにまつわる論争 で、どっちがいいの? JavaScriptには、 自動セミコロン挿入 という機能があり、行末でセミコロンを省略しても、多くの場合文法的に問題ありません。 しかしながら、 JavaScript: The Good Parts などで指摘されているように、自動セミコロン挿入は有害な機能であるため、JavaScriptのステートメント末尾には必ずセミコロンを付与するというのがフロントエンドエンジニアの共通認識だと思っていました。1 ところが、 Bootstrap に含まれるJavaScriptコードを見てみると、基本的にセミコロンが使用されていません。 調べてみると、どうも世の中にはJavaScriptのステートメント末尾にセミ

みなさまこんにちは！ Advent Calendar 4日目ということで、今回Webに関するネタをご紹介します。 フロントエンド実装のときに、枠内にメッセージを収めるためにみなさまはどうしていますか？ 完全にハードコーディングであれば文字が枠に収まるように調整すればいいですが、 最近は動的にデータを取得することが当たり前となり、それに応じていろいろ調整しなければなりません。 しかし、レイアウトやデザインの都合上、枠のサイズを変えたくない・・・・・・ そのために枠のサイズを固定にする場合も多いと思います。 短文であれば、このようにおさまりますね！ しかし、長文だった場合・・・・・・ このようにはみだしてしまいますね！ 例になっている私のお寿司?への思いも、これでは正しく伝えることができませんね（？） こうならないようにどうすべきでしょうか？ 1.ぶった切る overflow: hidden;

はじめにこんちには。万葉でエンジニアをしている koheitakahashi です。 この記事では、既存のサービスに Hotwire を部分的に導入した際に得られた知見として、どのような問題に直面したかということと、その対応策をご紹介します。 Hotwire の導入を検討している方にとって、この記事が導入の判断材料になれば幸いです。 導入したサービスの概要今回は、弊社が参画しているローカルワークス様のリフォマ というサービスに Hotwire を導入しました。 リフォマは、住まいの「困った！」を解決するマッチングサービスです。2016年から稼働しています。詳しくは、ローカルワークス様の以下の記事を御覧ください。 建設業界の「信頼性」を可視化する！　リフォームのマッチングプラットフォーム「リフォマ」についてご紹介 主な技術スタックは以下の通りです（2022年11月現在）。 Ruby 3.1.

この記事はun-T factory! XA Advent Calendar 2021の16日目の記事です。 この記事で伝えたいこと querySelectorAllとgetElementsBy~系の取得できるオブジェクトの違い、またその振る舞い 処理の早さ(重さ)の比較 querySelectorAllとgetElementsBy~ 2年のエンジニア生活で数えきれないほど使用したquerySelector(All)。 便利だからーというより、初めて見たjsのコードがこれで、以降盲信的に使い続けてきました。 反面、 2年のエンジニア生活でquerySelector(All)以外を使用したことが**あったようななかったような...**というレベルで、それ以外を知らなすぎる。 今後、よりquerySelector(All)をご機嫌に使えるように一旦立ち止まり掘り下げていきたいと思い立った次第です

Ruby on Rails 6は、オープンソースのWebアプリケーションフレームワークです。「同じことを繰り返さない」というRailsの基本理念のもと、他のフレームワークより少ないコードで簡単に開発できるよう設計されています。 JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

はじめに Rails7で標準装備となっているimportmapを使用しGoogleMapsを表示させます。スクリプトを単体で読み込ませる方法と全体で読み込ませる方法について解説します。 importmap以外にもJavaScriptについても少々解説するので、"JavaScriptはこれから"という人にも分かりやすい内容になっているかもしれません。 実行環境 Ruby 3.2.2 Rails 7.0.4.3 やりたいこと マーカーが配置された Google マップをウェブサイトに追加する TL;DR（お急ぎの方） まずはやりたいことを実現可能なコードを掲載し、後のパートで解説いたします。 GoogleMapsのスクリプトを読み込むには大きく以下２つのアプローチがあります。 ページ全体で読み込む 特定ページのみで読み込む ページ全体で読み込む GoogleMapsをページ全体で読み込ませるこ

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

フロントエンド部分の開発を進めていくと、 「もっと動きをつけたいなぁ」とか、 「あのサイトのかっこいい動きを真似したいなぁ」と思い、 どんどん凝った仕様にしたくなりますよね。 そのリッチな動きや仕組みを実現する際に、 Javascriptは必須で使われています。 ここではRuby on Rails内でJavascriptを読み込む方法を紹介していきます。 今回は、代表的な以下の3つの方法をご紹介します。 方法1: 別ファイルにしてjavascriptを読み込ませる 方法2: 特定のビューにjavascriptを読み込ませる 方法3: ビューファイル(.erb)に<script>タグで処理を書く 方法1: 別ファイルにしてjavascriptを読み込ませる Ruby on Railsを使用している場合、JS(javascript)ファイルを以下の指定の場所に格納すればjavascriptを読

回答 (9件中の1件目) jQueryはもともとES5やES6の言語仕様のブラウザでの実装の度合いにバラつきがあった時期に、ブラウザハックを使わずに「ブラウザ互換」のプログラムを書けるようにする目的で作られたものです。その前に大流行したprototype.jsというフレームワークはAJAXを便利に使えるようにするものでしたが、jQueryではAJAXの扱いの容易さに加えてブラウザ互換、セレクタの豊富さ、イベント処理の書きやすさ、といった点で劇的に便利だったので、prototype.jsを置き換える形で一気にjQueryが普及しました。ただ、プロトタイプベースやプロトタイプチェーンというJ...

はじめに 私は長い間レガシーコードと共に仕事をしてきましたが、jQueryの重要性は依然として頻繁に話題に上がるトピックの一つです。ライブラリ自体は便利なままですが、それは別の時代のニーズを完璧に満たしていました。 現在、私たちは既にES2023について話していますが、過去にjQueryがカバーしていたほとんどの機能は、すでに2015年にリリースされたES6に取り込まれています。 ES6の標準は既に広範にサポートされており、96％のレベルに達しています（出典：caniuse.com）。そのため、特に要素の選択、スタイリング、アニメーション、データの取得などの基本的なタスクについては、ライブラリの使用を見直す良いタイミングかもしれません。 以下のトピックは、いくつかの標準的なjQueryのパターンと、それに相当するバニラJavaScriptでの手法を示す参考資料として役立つと思います。 要素