今日やったこと Udemyの「Web開発入門完全攻略コース - プログラミングをはじめて学び創れる人へ！未経験から現場で使える開発スキルを習得！」のセクション3の19~21 パートごとにとったメモです↓ 19.コメント コメントの使い方に関する動画。 Atomでは「commandキー+/キー」で簡単にコメントのオンオフを切り替えることができます。 時短のために使いましょう。 20.基本的なタグ 基本的がタグに関する解説動画。 タグの中で改行したい時 <p>段<br>落１</p> 強調したい時 <p><strong>段落２</strong></p> 斜体にする <p><I>段落３</I></p> <p><em>段落４</I></p> 21.文法チェック HTMLの文法が間違っていないかは以下のサイトでチェックできます↓ (https://validator.w3.org/) URLを打ち込む HTMLファイルをアップロードする HTMLのコードを直接打ち込む の３種類の方法で文法間違えをチェックすることができます。 今日はあまり進みませんでしたが、明日からも引き続きプログラミング学習を頑張っていきます。 おわり
パートごとにとったメモです↓
コメントの使い方に関する動画。 Atomでは「commandキー+/キー」で簡単にコメントのオンオフを切り替えることができます。 時短のために使いましょう。
基本的がタグに関する解説動画。
タグの中で改行したい時
<p>段<br>落１</p>
強調したい時
<p><strong>段落２</strong></p>
斜体にする
<p><I>段落３</I></p> <p><em>段落４</I></p>
HTMLの文法が間違っていないかは以下のサイトでチェックできます↓ (https://validator.w3.org/)
の３種類の方法で文法間違えをチェックすることができます。
今日はあまり進みませんでしたが、明日からも引き続きプログラミング学習を頑張っていきます。
おわり
Coder使ってみた！ ブラウザでVS codeが使えるクラウド IDEの大本命「Coder」 Coderはブラウザ上でVSCodeがそのまま使えるIDEです。 多分本来の使い方ではないですが、 秒速でサーバを立てて動作確認する方法。 プロジェクトを作成して、index.htmlを作成する。 index.html <html> <head> <title>test</title> </head> <body> hello world!! </body> </html> プロジェクトのターミナルからコマンドが叩けます。 npmは最初から使えます。 serveでサーバを立てるためのパッケージ ngrokはlocalhostをグローバルに公開するためのパッケージ をインストールします。 $ npm install serve ngrok $ npx serve . & ┌─────────────────────────────────────────────────┐ │ │ │ Serving! │ │ │ │ - Local: http://localhost:5000 │ │ - On Your Network: http://172.20.64.2:5000 │ │ │ └─────────────────────────────────────────────────┘ $ npx ngrok http 5000 ngrok by @inconshreveable (Ctrl+C to quit) Session Status online Session Expires 7 hours, 59 minutes Version 2.2.8 Region United States (us) Web Interface http://127.0.0.1:4040 Forwarding http://1d8aee5b.ngrok.io -> localhost:5000 Forwarding https://1d8aee5b.ngrok.io -> localhost:5000 Connections ttl opn rt1 rt5 p50 p90 0 0 0.00 0.00 0.00 0.00 ngrokで払い出されたURLにアクセス （この場合は、https://1d8aee5b.ngrok.io）
Coder使ってみた！ ブラウザでVS codeが使えるクラウド IDEの大本命「Coder」
Coderはブラウザ上でVSCodeがそのまま使えるIDEです。
多分本来の使い方ではないですが、 秒速でサーバを立てて動作確認する方法。 プロジェクトを作成して、index.htmlを作成する。
<html> <head> <title>test</title> </head> <body> hello world!! </body> </html>
プロジェクトのターミナルからコマンドが叩けます。 npmは最初から使えます。
serveでサーバを立てるためのパッケージ ngrokはlocalhostをグローバルに公開するためのパッケージ をインストールします。
$ npm install serve ngrok $ npx serve . & ┌─────────────────────────────────────────────────┐ │ │ │ Serving! │ │ │ │ - Local: http://localhost:5000 │ │ - On Your Network: http://172.20.64.2:5000 │ │ │ └─────────────────────────────────────────────────┘ $ npx ngrok http 5000 ngrok by @inconshreveable (Ctrl+C to quit) Session Status online Session Expires 7 hours, 59 minutes Version 2.2.8 Region United States (us) Web Interface http://127.0.0.1:4040 Forwarding http://1d8aee5b.ngrok.io -> localhost:5000 Forwarding https://1d8aee5b.ngrok.io -> localhost:5000 Connections ttl opn rt1 rt5 p50 p90 0 0 0.00 0.00 0.00 0.00
ngrokで払い出されたURLにアクセス （この場合は、https://1d8aee5b.ngrok.io）
https://1d8aee5b.ngrok.io
Coder使ってみた！ ブラウザでVS codeが使えるクラウド IDEの大本命「Coder」 Coderはブラウザ上でVSCodeがそのまま使えるIDEです。 多分本来の使い方ではないですが、 Coder上で秒速でサーバを立てて動作確認する方法。 プロジェクトを作成して、index.htmlを作成する。 index.html <html> <head> <title>test</title> </head> <body> hello world!! </body> </html> プロジェクトのターミナルからコマンドが叩けます。 npmは最初から使えます。 serveでサーバを立てるためのパッケージ ngrokはlocalhostをグローバルに公開するためのパッケージ をインストールします。 $ npm install serve ngrok $ npx serve . & ┌─────────────────────────────────────────────────┐ │ │ │ Serving! │ │ │ │ - Local: http://localhost:5000 │ │ - On Your Network: http://172.20.64.2:5000 │ │ │ └─────────────────────────────────────────────────┘ $ npx ngrok http 5000 ngrok by @inconshreveable (Ctrl+C to quit) Session Status online Session Expires 7 hours, 59 minutes Version 2.2.8 Region United States (us) Web Interface http://127.0.0.1:4040 Forwarding http://1d8aee5b.ngrok.io -> localhost:5000 Forwarding https://1d8aee5b.ngrok.io -> localhost:5000 Connections ttl opn rt1 rt5 p50 p90 0 0 0.00 0.00 0.00 0.00 ngrokで払い出されたURLにアクセス （この場合は、https://1d8aee5b.ngrok.io）
多分本来の使い方ではないですが、 Coder上で秒速でサーバを立てて動作確認する方法。 プロジェクトを作成して、index.htmlを作成する。
会社のテックブログにて書いたので、リンク貼っておきます。 SEO対策のためにHTMLのアウトラインと今一度真剣に向き合ってみた
会社のテックブログにて書いたので、リンク貼っておきます。
SEO対策のためにHTMLのアウトラインと今一度真剣に向き合ってみた
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1"> いつもinputは16px以上でとデザイナーの方に言っていたのですが、格好いいデザインなのでどうにかできないかといろいろやってたら上でできました。 iPhone、Androidともに拡大しない。(ここでいうAndroidは9を指します。) Androidの場合maximum-scale=1を入れるとズームインできなくなるみたい。 なお、Androidの場合 <meta name="viewport" content="width=device-width,initial-scale=1"> のみでも拡大しない。前は拡大してたような… JSでUA判別してViewport切り替えるのがベストなのでしょうか
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
いつもinputは16px以上でとデザイナーの方に言っていたのですが、格好いいデザインなのでどうにかできないかといろいろやってたら上でできました。
iPhone、Androidともに拡大しない。(ここでいうAndroidは9を指します。) Androidの場合maximum-scale=1を入れるとズームインできなくなるみたい。
なお、Androidの場合
<meta name="viewport" content="width=device-width,initial-scale=1">
のみでも拡大しない。前は拡大してたような… JSでUA判別してViewport切り替えるのがベストなのでしょうか
