プログラミングの初心者が、短期間でWebサイトの作成方法を学ぶには、どのような順番で勉強していけば良いでしょうか？ 今回は、基本となる技術要素を検討してみます。 Webサイト制作に関わる知識はたくさんありますが、まずは基本となる骨格を作り、さらに周辺の知識を肉付けしていけば、時間の短縮になると思います。 1周目：基本 1周目のWebデザイン 1周目のWebプログラミング 1周目のWebサーバー管理 2周目：肉付け 2周目のWebデザイン 2周目のWebプログラミング 2周目のWebサーバー管理 3周目 分類の方法にも拠りますが、Web開発には主に３つの分野／技術要素があります。 Webデザイン Webプログラミング Webサーバー管理 それぞれに必要となってくる知識を見てみましょう。 イラスト図解式 この一冊で全部わかるWeb制作と運用の基本 作者:NRIネットコム株式会社,小出修平,塚田

WebサイトのSSL証明書でLet's Encryptを利用しています。 SSL証明書を定期的に更新するツールとして「Certbot」を使っていますが、エラーメッセージが出ていたので、解決方法を調べてみました。 jsstudy.hatenablog.com Certbotのエラーメッセージ 解決策の調査 snapの用意 getSSLで代用 ACME v2対応の確認 まとめ Certbotのエラーメッセージ Your system is not supported by certbot-auto anymore. certbot-auto and its Certbot installation will no longer receive updates. You will not receive any bug fixes including those fixing server co

プログラミングの上達方法について、はてなブックマークで話題になっていました。 b.hatena.ne.jp またこいつか！ コンピューターサイエンス（CS）とは？ CSの独学方法 定番のタネンバウム本 CSの必要性 初心者に役立つプログラミング学習方法 設計の定番 まとめ またこいつか！ 記事の執筆者は炎上商法の方でした。 （以前ブコメで絡まれたことがあるので覚えていましたｗ） ↓↓↓ オブジェクト指向って便利なの？ - JavaScript勉強会 うへええええ継承による差分プログラミングとか現代に言わないでくれよ。しかも「JSはプロトタイプベースのOOP」を初めとして間違いが多いぞ 2017/03/27 09:42 b.hatena.ne.jp 逆にブコメの間違いを指摘したら、ブコメを非公開にして逃げられました。 jsstudy.hatenablog.com jsstudy.hatena

ReactやReasonのWebサイトを見ていたら、 「Black Lives Matter. Support the Equal Justice Initiative.」 という文言がトップに掲げられていました。 ja.wikipedia.org ブラック・ライヴズ・マター（英: Black Lives Matter、通称「BLM」）は、アフリカ系アメリカ人のコミュニティに端を発した、黒人に対する暴力や構造的な人種差別の撤廃を訴える、国際的な積極行動主義の運動である。特に白人警官による無抵抗な黒人への暴力や殺害、人種による犯罪者に対する不平等な取り扱いへの不満を訴えている。 日本語ページにはなかったけど英語ページにはあったので、黒人差別問題はアメリカでは深刻な話題なんだな〜と実感するとともに、外国のエンジニアはハッキリと自己主張するんだなと思いました。 ReasonReact（英語ページ

はてなブックマークで便利なWebサービスが話題になっていました。 https://anond.hatelabo.jp/20200525021541 anond.hatelabo.jp 記事のトラックバックやブックマークのコメントが参考になりました。 https://b.hatena.ne.jp/entry/s/anond.hatelabo.jp/20200525021541 b.hatena.ne.jp 知らないツールやWebサービスもあったので、良さそうなのをメモ。 情報収集 ウェブ魚拓 RSSリーダー hckr news ノイズレスサーチ 情報整理 start.me 検索デスク Myfaves IFTTT RAINDROP.io Zotero tagtory 情報交換 IRCCloud Trickle Discord タスク管理 Zenkit Habitify 作業の自動化 Zapie

以前、Pythonでハッシュ値を計算するGUIアプリを作ったことがありました。 jsstudy.hatenablog.com ブラウザーが使える環境なら、PythonでGUIアプリを作るよりも、JavaScriptでWebアプリを作る方が簡単です。 参考情報 qiita.com note.onichannn.net labs.cybozu.co.jp www.ipentec.com 以上の情報を参考にして、ハッシュ値を計算するWebアプリを作ってみましょう。 md5ハッシュ値を計算するJavaScriptのWebアプリ (1) 以下のページから、「md5.js」というJavaScriptファイルをダウンロードします。 https://labs.cybozu.co.jp/blog/mitsunari/2007/07/md5js_1.html ↓ https://labs.cybozu.co.

読書メモを図にしたいとき、簡単なグラフを作成できるツールがあったら便利です。 調べたらいくつか候補がありました。 PlantUML　https://plantuml.com/ja/ Mermaid.js　https://mermaidjs.github.io/ Typora　https://typora.io/ 今回は、手軽に使えて、拡張性もありそうなMermaid.jsを試してみます。 Mermaid.jsとは？ Visual Studio CodeでMermaid.jsを使う方法 Markdown Preview Enhancedの使い方 図の出力 見た目のカスタマイズ 参考 Mermaid.jsとは？ Mermaid.jsは、JavaScriptでグラフやチャート図を描くためのライブラリーです。 （英語の「mermaid」は、日本語で「人魚」という意味） （公式サイト） https:

無料で学べる「JMOOC」というオンライン講座があります。 JMOOCの中に、JavaScriptの講座もありました。 JMOOC https://www.jmooc.jp/ www.jmooc.jp ja.wikipedia.org 一般社団法人日本オープンオンライン教育推進協議会（Japan Massive Open Online Courses Promotion Council）は、2012年より米国で始まった無償教育サービス「MOOC」（オンラインで大学レベルの授業を無償で公開し、終了条件を満たした受講者に修了証を提供する）の日本語での無償提供及びその普及・拡大を目的とし、2013年11月に設立された非営利団体である。 略称は「JMOOC（ジェイムーク）」。 JavaScript講座 https://www.fisdom.org/F00000125/ www.fisdom.org

自分に対する投資として、週１の読書に取り組んでいます。 jsstudy.hatenablog.com 今週の読書は、子供向けのJavaScript入門書の「JavaScriptふりがなKidsプログラミング」という本を読んでみました。 子どもから大人までスラスラ読める JavaScriptふりがなKidsプログラミング ゲームを作りながら楽しく学ぼう！ ふりがなプログラミングシリーズ 作者:リブロワークス 発売日: 2019/11/22 メディア: Kindle版 2020年4月から小学校でプログラミング教育が必修化されます。 プログラミング教育：文部科学省 小学生にプログラミングを教えるにはどうすれば良いでしょうか？ 小学5年生以上が読者対象になっている本書は、教育方法の参考になるかと思います。 目次 はじめに 監修者・著者・イラストレーター紹介 プログラムの読み方 チャプター（１） J

自分に対する投資として、週１の読書に取り組んでいます。 jsstudy.hatenablog.com 今週の読書は、Amazonのビジネスについて分析した「ベゾス・レター」という本を読んでみたいと思います。 ベゾス・レター　アマゾンに学ぶ14ヵ条の成長原則 作者:スティーブ・アンダーソン,カレン・アンダーソン 出版社/メーカー: すばる舎 発売日: 2019/11/20 メディア: Kindle版 注意点として、この本はAmazonの社員が書いた本でなく、経営コンサルタントがAmazonを分析した内容なので、Amazonの実態とは若干違う部分もあろうかと思います。 https://www.amazon.co.jp/gp/customer-reviews/R29JTK9IX3BCHV/ 外から見たアマゾンの評価本 2020年1月29日 アマゾンに勤めた人が、自身の経験を、アマゾンの競争優位性

東大医学部卒のプログラマーの方が、プログラミングの勉強についてご紹介されていました。 togetter.com 週に１冊のペースぐらいで入門書を読破されているそうです。 本によってボリュームや難易度は違うので、一概に早い遅いを論じることはできませんが、それでもコンスタントに読み進められる習慣はスゴイ!と思いました。 は～、自分もこれぐらいのペースで本を読んでいけたらいいなーｗ 今年は頑張って、週１のペースで本を読みたいです！ 「やればできる」という見本があったので、努力目標にしてみます🙌 それにしても、Lillianさんの成長曲線は凄いな！ jsstudy.hatenablog.com あっという間にグングンとスキルアップされています。 関数型プログラミングに興味があって、Haskellを書いて実行できる環境を整えました😊 入門用の本をなにか買ってみます！ pic.twitter.co

Dockerの入門書で分かりやすい本がありました。 「自宅ではじめるDocker入門」という本です。 自宅ではじめるDocker入門―人気のコンテナ型「仮想化ソフト」を使ってみる! (I・O BOOKS) 作者:浅居 尚 出版社/メーカー: 工学社 発売日: 2019/02/01 メディア: 単行本 目次 出版社情報 著者紹介 書評 目次 （https://www.kohgakusha.co.jp/books/detail/978-4-7775-2072-5 より） 第1章 Dockerのポイント ［1-1］　仮想サーバより軽量な、コンテナ型の仮想技術、Docker ［1-2］　Dockerを動かすための環境 ［1-3］　本書の構成 第2章 Dockerを実際に動かそう ［2-1］　2章の流れ ［2-2］　Linuxサーバに、Dockerをインストールする ［2-3］　Dockerの基本

UbuntuにVisual Stuidio Codeをインストールしたら、アクティビティ バー（画面左側にあるアイコンの並び）の「ソース管理」で、「ソース管理プロバイダーが登録されていません。」と表示されました。 このエラー表示の解消方法を調べてみました。 Gitのインストール Gitのリポジトリ作成 Gitのパス設定 Gitの参考情報 まとめ Gitのインストール ソースコードを管理するソフトはいろいろありますが、とりあえずGitにしておきます。 ja.wikipedia.org UbuntuにGitが入っていない場合、まずはGitをインストールします。 Gitのバージョンを確認して、Gitの有無を確認します。 $ git --version Gitのバージョン情報が表示されなければ、まだGitが入っていないということなので、インストールします。 （参考） zorinos.seesaa.

フィンランドのヘルシンキ大学のプログラミング講座が無料で公開されています。 fullstackopen.com Learn React, Redux, Node.js, MongoDB, and GraphQL Reactなど、JavaScriptでWebアプリを作る際に使われる技術について学習できます。 （紹介記事） developer.feedforce.jp この講座をブックマークして、時間だけが過ぎてしまったので、今日から読み始めてみたいと思います。 （今からやらないと年を越してしまう可能性もあるｗ） React利用の説明方法を参考にしてみたいと思います。 ライセンス Authors and License The course material is written by Matti Luukkainen. Numerous people have improved and co

「Yarn」は「npm」を改良したツールです。 yarnpkg.com 前提 Yarnのインストール Yarnとnpmの違い まとめ 前提 WindowsにYarnをインストールする場合、事前に Node.js npm がインストールされている必要があります。 Node.jsとnpmまだ入ってない場合は、先にインストールしておきます。 （参考） jsstudy.hatenablog.com Yarnのインストール Windowsでコマンドプロンプトを開き、以下のようにコマンドを入力します。 npm install -g yarn Yarnがインストールされたら、以下のコマンドでYarnのバージョンを確認してみます。 yarn -v 「1.19.1」などとバージョンが表示されたらOKです。 Yarnとnpmの違い npmの代わりにYarnを使うメリットは何でしょうか？ （参考） www.go

nodistの新しいバージョンが出ていたのでアップデートしました。 アップデートのやり方を検索したら、新しいインストーラーをそのまま実行すれば良いみたいでした。 nodist 0.8.8 → 0.9.1へ更新 （参考） ksby.hatenablog.com https://github.com/nullivex/nodist/releases から NodistSetup-v0.9.1.exe をダウンロードし、実行します。 「Welcome to Nodist Setup」画面が表示されます。「Next >」ボタンをクリックします。 「License Agreement」画面が表示されます。「I Agree」ボタンをクリックします。 「Choose Install Location」画面が表示されます。「Destination Folder」に 0.8.8 をインストールした時の D:

モダンなJavaScriptの要点について紹介された資料がありました。 speakerdeck.com 要点 アロー関数 クラス 非同期処理 各機能の利便性に注目 要点 モダンJavaScript再入門 / Re-introduction to Modern JavaScript - Speaker Deck [JavaScript] [入門] ?slide=12 アロー関数 ・関数の理解はモダンJS理解への近道 ・functionの必要性が減っている / ?slide=15 クラス ・prototypeのことは忘れよう / ?slide=27 非同期処理とは？ ・モダンなWebフロントエンド開発には必須の知識 2019/11/02 13:05 b.hatena.ne.jp アロー関数 関数の理解はモダンJS理解への近道 functionの必要性が減っている クラス prototypeのこ

プログラミングスクールで学んでいた方が、強制的に退会処分になった話が話題になっていました。 web-u-katsu.hatenablog.com ウェブカツの今後の「稼ぎ方」について、ウェブカツで学習したプログラミング「以外」のことを使って考えてみた - アラサー女のゼロからエンジニア！ #ウェブカツ #斎藤和樹 [プログラミング] [教育] [セキュリティ] 情報弱者といってしまえばそれまでだけど、被害者はかわいそうですね。被害者をこれ以上増やさないためには、もっと良いプログラミングスクール／講座を作って提供すればいいですね。それじゃ、一丁作ってみますかｗ 2019/10/30 22:27 b.hatena.ne.jp ブログで言及されていたプログラミングスクールについて調べてみると、個人的にはコスパが良くないと思いました。 自分だったら、もっと他のプログラミングスクールや講座を利用しま

JavaScript学習マラソンの第18回は、 「現代の JavaScript チュートリアル」パート１の2.15「関数式とアロー」です。 関数式とアロー https://ja.javascript.info/function-expressions-arrows を読んでみます。 JavaScriptの関数の書き方にはバリエーションがある 前回は、JavaScriptの「関数」の書き方（関数宣言）について学びました。 jsstudy.hatenablog.com 今回も、JavaScriptの「関数」の書き方を学びますが、前回の「関数宣言」とは別の書き方を学びます。 関数宣言 関数式　←New！ アロー関数　←New！ 「関数式」と「アロー関数」について、JavaScriptチュートリアルの説明を見てみましょう。 ja.javascript.info 数値aと数値bの合計を求める関数が、

はてなブックマークで学生時代の過ごし方について話題になっていました。 ブコメや増田でもコメントしましたが、もう少し補足しておきます。 元ネタ アイデア コメント 職業プログラマーのキャリア 労働者プログラマー 経営者プログラマー 投資家プログラマー 資本家プログラマー まとめ 元ネタ anond.hatelabo.jp 私は大学４年生だ。いわゆる、華の女子大生である。夏頃に就活を終えて無事内定を頂くことができ、学校の授業は週に１回という時間の余りっぷりだ（ただし卒論が終わっていない。まずいぞ）。 そんな私は、入学してから今日まで「学生時代にしか出来ないことをしてね」「もうこんなに自由な時間はないのだから」「悔いの残らない学生生活を送ってね」…この類いの言葉を何度も何度も掛けられた。大人達は、きっと親切心からこれらのアドバイスをくれたんだと思う。実際に働いてみて思うところがあったのかもしれな