tamakipedia

フロントエンドエンジニア。Typescriptもう特訓中です。一日の振り返りや学んだことをちょっとずつ吐いています。

2020-01-01から1年間の記事一覧

【 react 】'Component' is not defined no-undef

コンポーネントを継承したクラスを作る際には importでコンポーネントそのものをインポートする必要があるようです。 以下は エラーの内容です。 エラー 'Component' is not defined no-undef コンポーネントが定義されていない!とお叱りを受けてしまいまし…

【 react 】react内での書き方のルール

三月は卒論もなく、授業もない、バイトももうすぐ退社するので 時間が余りまくるので、7時間睡眠を意識して参りたいと思います。 意識していないとついつい 「短時間しか寝てない方がかっこいい」 という風に中二病臭い人物になってしまい、 予定を沢山入れ…

【 css 】カスケーティングとは

おはようございます! 前回のz-indexに引き続きcssの勉強をしていきたいと思います! 今日はカスケーティングという言葉について! カスケーティングとは cssが当たる優先順位の仕組みのことです。 そもそもカスケードとは滝という意味があります。 ググって…

【 sass 】z-indexをsassで管理する

今日とあるプロジェクトの修正で z-indexがめちゃくちゃなサイトに出会いました。 そこで今回はz-indexって「どうやって管理したらいいのか」について sassの変数を利用した方法があったので それについて、調べたことを書いていこうと思います! そもそも実…

【 react 】jsxを使ってみる

jsxを使えば、creatElementせずとも 直感的にエレメントを表示することができます。 JSXとは 拡張構文と呼ばれ、reac的なDOMの指定方法をより直感的に指定できるようにする手法です。 書き方はHTMLで書く時同様の書き方になります。 コンパイルするときにRea…

【 react.js 】 index.html内の文字を書き換える

ついにreactの勉強スタート reactのフレームワーク next.js の参考書は今の所一つしかないらしいのです。 kindleだと今なら50%ポイント還元!笑 https://www.amazon.co.jp/dp/B07X7DHZ9F/ref=dp-kindle-redirect?_encoding=UTF8&btkr=1 ということでやってい…

【 javascript 】npx と npm の違い

おはようございます! 大学最後の卒論発表に向けて着々と準備が進んでまいりました。 やはりいつになっても人前で話すことは慣れないですね.... ということで今日もいってまいりましょう 42tokyo.jp シリコンバレーにある学費無料、エンジニア養成機関"42"が…

【 本 】Deep Work は小刻みのタスクを管理することで、継続して集中する環境を作り上げるための実践本

先週末に一気読みしたので、忘れないうちにめもめも。 今週は常に集中力0な私にとってぴったりな本 『DEEP WORK:大事なことに集中する』 を展開していきたいと思います。 今回の本は、英語やプログラミングの学習方法を調べる際に聞いたことある情報の総集…

【 wordpress 】 MAMP を起動させてローカルでワードプレスを立ち上げる

今日はmampを使って、wordpressのサイトを立ち上げるまでをおさらいしていきます。 と言うのも、久しぶりにおとといwordpressをローカルで立ち上げる際 めーちゃくちゃ苦戦しました。 手数は思ったより多くないので簡単にまとめてみました。 目次 MAMPとは M…

【 canvas 】マス目を作る / 背景色を配置

参考書を参考にして謎のゲームを作ったので、 一つ一つ噛み砕いていくことにします。 マス目を作る! See the Pen canvas study by たまき こう (@ulqvhvox) on CodePen. 今回、十字キーで移動するフィールドを描画していきます。 わかりやすいようにそれぞ…

今週の振り返り

ブログ・今週の振り返り 52/7週間が終了しました。 今週の出来事 PC内部の勉強 ペライチ作成 技術 「フレームワーク」と「テンプレート」の意味を理解しました。 テンプレートはviewを表示するフレームのようなイメージで フレームワークは、データベースと…

PCの登場人物達

2月も気がついたら、もう半分が終わってしまった!! 早いですね、、、早え、、笑 プログラミングも大事だけどPCの根本もちょこちょこ勉強していこうとおもいまし。 PCの登場人物 PCは主にCPU・メモリ・SSD・HDDで構成されています。 * CPU → 計算 * メモリ …

「メモリ」について

PCの中でも計算の役割を果たしているCPUという部位があります。 CPUと短期記憶の役割であるメモリは、処理スピードが全く違います。 それらを解決するのが、CPUキャッシュです。 CPUキャッシュ メモリがCPUにデータを送る際に一度、同じデータをキャッシュに…

【 javascript 】consoleオブジェクトのメソッド

メソッドの確認方法がわかりました。 というかconsole.logって普段何気に使っているけど console(オブジェクトの).log(メソッド)なんて 意識して使ったことありませんでした。笑 オブジェクトであれば他のメソッドもあるはず.... okinawanpizza.hatenablog.c…

【 javascript 】 メソッドの確認方法

ついに大学四年後期の授業が終了。 昨日バイト終わり次第すぐに学校にいって成績確認しました。 無事卒業単位足りてました。笑!!!(歓喜) テンションぶちあげで行きたいと思います。 オブジェクトのメソッドの確認方法 1 オブジェクトの配列をブラウザで…

ビット演算!?

今日jsの参考書を模写していた際 ビット演算という処理に遭遇しました。 最初はなんだかちんぷんかんぷんだったのだが、 理解した瞬間に感動しました。wwwwwwwwwwww 椎名林檎の曲「流行」を初めて聞いたときの衝撃があったので、忘れないうちに下ろしておき…

CDN の仕組み

slick使う機会があって 今回もいつも通りCDNを使ったんだけど そもそもCDNってなんなのか 噛み砕いていきましょう! CDNとは CDNとはContent Delivery Networkの略で, 別のサーバーにコピーを置くことで誰でも使えるようにしたものです。 別のサーバーに負荷…

今週の振り返り

ブログ・今週の振り返り 52/6週間が終了しました。 今週の出来事 * slickの学習 * 今やっているLP完了 技術 * slick 簡単にスライダーが実装できるフレームワーク 日記 今週は仕事であるLP作成に時間を費やす日々でした。その中でもcssでスライダーを実装し…

【 HTTP 】ディベロッパーツールでcache-controlを確認する

先日キャッシュについて学習したので自分なりにざっくり解説してみました。 okinawanpizza.hatenablog.com ありがとう google 。 キャッシュを目視したい!!に関しては、 Fastly というツールで url を入力してそこのキャッシュを確認できるらしい。 ( もう…

【 HTTP 】キャッシュ cache をざっくり解説!!!

今日はキャッシュあたりで作業がつっかえました。 色々調べたので、まとめます。笑 本日はキャッシュについて、ざっくり解説していこうと思います。 webページを作る際、実際にブラウザで表示して確認する「ブラウザテスト」なるものがあります。 そこでは時…

can I use でプロパティーにプレフィックスが付いていた時期の確認

あとテスト&レポート一つずつ! 頑張っていきましょう! 前回npmのパッケージ autoprefixer をおさらいしました。 前回の記事 https://okinawanpizza.hatenablog.com/entry/2020/02/05/235938 こちらが実際に支えているのかの確認として 実際にプロパティー…

【 javascript 】 Replace Autoprefixer browsers option to Browserslist config 対処法

この記事めちゃくちゃ当てはまりすぎてびっくりしました。。 "市場価値"といったことばのみならず、抽象的なワードを追いかけないように気をつけなきゃ。 「自分の市場価値を高めたい」と言う人ほどコモディディ化しちゃってる問題 - Work,Live,Thinking - M…

【 javascript 】ダンボールを寄せるゲーム

昨日参考書にかかれいた通りに模写したのだけれども、 const じゃなくて var が使われまくっていて varもそのまま模写するたびに es6さんごめんなさい..ってなってる私です。 どんどんゲーム作っていくよー! どうやら写真も使っているために、 コードペンに…

【 HTML 】<img ..... />

参考書に出てくる <img>タグが少し変、、、 <img id="imgWall" src="imgWall.png" style="display:none" /> 調べてみると、 このスラッシュには終了タグがいりませんよ- と言う意味で付いているらしい.. xml と html を掛け合わせた XHTML で推奨されている書き方らしく、 HTML5からは正式に推奨されているらしいです。 参考…

今週の振り返り

52/5週間が終了しました。 1ヶ月やってみて、「聞いたことある言葉の量」が めちゃくちゃ伸びたんじゃないかなと思っています。 2ヶ月目は本をじっくり読むのではなく、出来るだけ「作る」を中心に行なって、 1ヶ月目に聞いた言葉をたくさん結び付けられれば…

【 javascript 】三つのカードからあたりを引き当てるゲーム

課題とテストと急遽始まった引っ越し作業でが山積みになり、 いい感じで集中力発揮できています。嬉しい笑 そろそろjavascriptやんなきゃ、と言うことで教科書に乗っている簡単なゲームを作りました。 イベントハンドラの復習になるので、おためしあれ。 See…

【 javascript 】スライドしてフッダー固定

let menu_y = $('#menu').offset().top; let scroll_y = window.pageYOffset ; let head_to_menu = menu_y - scroll_y; let menu_h = document.getElementById("menu").scrollHeight; let window_h = window.innerHeight; let stop_line = window_h - menu_h…

HTTPの教科書メモ

~メモ~ 第8章 HTTPの認証方法は、セキュリティー度が低かったり、ハイコストであるなどして まだまだ課題が多く残されている。 第9章 現代はHTTPを根本的な部分(ボトルネック)から変えていかなければならないほど、用途が複雑・高度化している。 SPDYやweb…

【 HTTP 】HTTPの弱点とHTTPS

HTTPにも弱点があります。 HTTPの弱点 * 通信が暗号化されていないので盗聴可能 * 通信相手を確かめないのでなりすまし可能 * 完全性を証明できないので改ざん可能 対策 * 通信の暗号化( SSL , TLS ) * 内容の暗号化 * SSLによって通信相手を確かめる * ハッ…

今週の振り返り

52/4週間が終了しました。1ヶ月ほぼ終わりですね。 今月は内容の濃い一ヶ月間になったのではないかと思います。少なくともブログのおかげで学習の維持ができました。 あと二ヶ月継続して習慣化できたらいいです。 とりあえず、2月までは継続を意識して、3月…