りんごさん

現役フロントエンジニア。自慢出来るような経歴とかは特にないですが、頑張ってこの場での活…

りんごさん

現役フロントエンジニア。自慢出来るような経歴とかは特にないですが、頑張ってこの場での活動を続けて行こうと思います。主にJavaScriptに関する情報を発信して行きます!

マガジン

  • 【JavaScript超入門】Progate復習

    「Progateを1通りやったけどまだ不安…」 そんな人に向けて、Progateの単元1つ1つに対応した補足記事を超絶丁寧、分かりやすく解説していきます! Progateが教えてくれなかったことも書いていくので、是非見てみてください!

  • Vueとfirebaseで作る通信対局可能な将棋アプリ

    Vueとfirebaseを用いた将棋アプリの作成方法を紹介していきます。

  • 【りんごさんが身を持って教える】JavaScript解説

    JavaScript入門者〜中級者向けに、JSの難しいところや躓きやすいポイントを懇切丁寧に、分かるまで教えていくシリーズ

最近の記事

文字列の連結

こんにちは!りんご先生です 今回も一緒に学習していきましょう! 目次はコチラ Progateの対応するレッスンはコチラ 今回で文字列と数字は最後になりますが、内容的にはまた以前やった内容と同じなのでササっと済ませちゃいましょう! 数字を足し算すると中身で計算が行われますが、 文字列を足し算すると連結されるという特徴が有りましたね。 console.log(1 + 1) // 2console.log("1" + "1") // 11console.log("こんにちは

    • 計算してみよう(2)

      こんにちは!りんご先生です 今回も一緒に学習していきましょう! 目次はコチラ Progateの対応するレッスンはコチラ 今回も前回の延長で、 console.log()の中で掛け算、割り算、余りの計算をして見ましょう! ここは特に躓くところもないと思うので、さらっと説明していきたいと思います! 【掛け算】 console.log(2 * 3) // 6が表示される 【割り算】 console.log(10 / 2) // 5が表示される 【余り】 con

      • 計算してみよう

        こんにちは!りんご先生です 今回も一緒に学習していきましょう! 目次はコチラ Progateの対応するレッスンはコチラ 今回の内容は、実は前回の記事でほぼ触れてしまっています。 (先を見ずに書いてしまいました…笑) そこで少し付加情報を加えてお届けしたいと思います! まずは前回、どういった内容をやったかというと console.log("1") こんな感じで文字列を表示したり、 console.log(1) 数字を表示したり console.log(1 +

        • console.log()

          こんにちは!りんご先生です 今回も一緒に学習していきましょう! 目次はコチラ Progateの対応するレッスンはコチラ 今回からやっと実践編という感じですね! 一番最初にやるのは… 今後最も貴方を助けてくれる超重要な関数です! console.log()とは、中に記述された内容を表示する際に使う関数です。 「関数とは何か」という説明に関しては今後あると思うので、今はそういう命令文だと思ってください。 では実際に書いていきましょう! こちらの下準備がお済みでない方は、

        文字列の連結

        マガジン

        • 【JavaScript超入門】Progate復習
          7本
        • Vueとfirebaseで作る通信対局可能な将棋アプリ
          2本
        • 【りんごさんが身を持って教える】JavaScript解説
          3本

        記事

          JavaScript (ES6)を学ぼう

          こんにちは!りんご先生です 今回から一緒に学習していきましょう! 目次はコチラ Progateの対応するレッスンはコチラ 皆さん、ES6という言葉をご存知ですか? よくアプリとかでもバージョンが更新されたりすると、古いバージョンの人と一緒に遊べなくなったりして、バージョンの更新を促されますよね。 しかも古い端末だと、場合によってはサポートが打ち切られたりします。 ブラウザも同様です。 日本でよく使われているのは Chrome、Safari、Firefox、Edge

          JavaScript (ES6)を学ぼう

          下準備

          こんにちは!りんご先生です 一緒にProgateの復習に入る前に、まずは開発環境を整えていきましょう! 目次はコチラ Progateの対応するレッスンはコチラ 【下準備】 Progateのようにブラウザ上のエディタはないので、 適当にメモ帳を開き、index.htmlと言うファイル名にして保管してください。 こんな感じにファイルを作り、 名称を変えて保存! メモ帳でも何でも良いので開いて、 中身を<script></script>と言うタグで括ってください。 sc

          【Progate復習】リンゴと一緒に学ぶJavaScript超入門まとめ

          このマガジンでは、 「Progateを一通りやったけど不安…」と感じている人に向けて、 全く同じ単元をりんご先生が少し細かく、解説を加えてお届けします! 「Progateはまだやっていない…」といった人でもご理解いただける内容となっておりますが、並行して進めてもらうとより記憶として定着するかと思います。 プログラミング入門者に向けて、懇切丁寧に教えていきます。 もし分からないところがあればコメント欄にてお知らせください。 極力難しい言葉は使わずに解説していくので、見る人

          【Progate復習】リンゴと一緒に学ぶJavaScript超入門まとめ

          【挫折ポイント解説】JavaScriptのクラス、オブジェクトについて③

          こんにちは!りんごです 前回の記事では、クラスの一番最初の作り方に関して解説しました。 まだ1回目の記事を呼んでいない方はコチラ 前回までだと、確かこんな感じ終わりましたね。 // フルーツクラスclass Fruit{}let apple = new Fruit()console.log(apple) では話を進めましょう! 先ほど作っていただいたフルーツですが、 本当にそれはリンゴですか? 今のところ変数名にappleと名付けただけで、 そんなのは中身がリンゴ

          【挫折ポイント解説】JavaScriptのクラス、オブジェクトについて③

          【挫折ポイント解説】JavaScriptのクラス、オブジェクトについて②

          こんにちは!りんごです では前回に引き続きクラスとオブジェクト、やっていきましょう〜! 今回からやっとクラスの解説に入ります。 第一回目の記事はこちら まずクラスの作り方ですが、下記のように書きます。 <script>// フルーツクラスclass Fruit{}</script> ※適当にindex.htmlファイルを作って、上記をそのまま貼り付けてみてください。可読性重視のためscriptタグは次から省略します。 class 任意のクラス名 {} これが最小

          【挫折ポイント解説】JavaScriptのクラス、オブジェクトについて②

          【挫折ポイント解説】JavaScriptのクラス、オブジェクトについて①

          こんにちは!りんごです。 皆さま、プログラミング言語を扱う上で何かしらの”壁”というものにぶつかってしまった経験はおありでしょうか? ほぼどんな言語においても、みんな揃って オブジェクト思考難しい!! と言いますよね。 JavaScriptにおいても、コードを読んでいると急に class Hoge {} が出てきたりしてビビっちゃいます。 この記事では、他とは少し違う切り口からクラスとオブジェクトの関係性に関して書いてみようと思います。 (オブジェクト思考に入る

          【挫折ポイント解説】JavaScriptのクラス、オブジェクトについて①

          jQueryという存在について

          こんにちは!りんごです。 いきなりですが、皆様に質問です。 最近jQuery使っていますか…? 実しやかに囁かれているjQuery不要論ですが、実際のところはどうなのでしょうか。 わたくしりんごも、始めたばかりの頃はjQueryに支えられ、jQueryと共にJSの道を歩んできました。 そんなjQueryのことを応援したい気持ちは山々なのですが、この際はっきり言うとモダン開発の現場ではjQueryはもはや使われていません。 モダン開発の現場と前置きをしたのは、 わたく

          jQueryという存在について

          自己紹介

          こんにちは!リンゴです。 現役のWEBのフロントエンジニアをやっとります。 フロントに従事しているフルーティーな皆様なら共感いただけると思うのですが、 最近のフロントエンド難しくないですか?w ただでさえ流行り廃りの激しい分野とは言われていますが、 あれだけ使われていたjQueryは廃れ、今やAngular・React・Vueのいずれかを扱えることがフロントエンドに従事する上での条件となってきました。 そもそもライブラリとフレームワークを比べるのはどうかという指摘も受