KAEDE Hack blog

JavaScript 中心に ライブラリなどの使い方を解説する技術ブログ。

Entries from 2020-01-01 to 1 year

これならわかる!Linux 入門講座 第三版 感想

U01 ディストリビューション ディストリビューションには カーネル、ライブラリ、デバイスドライバ、アプリケーション、GUI 環境、 が入っている 中身を全然知らなかった 全てが無料なわけではなく、Redhat はサポートがついているので有料 全て無料だと思っ…

期末課題未提出の反省

私の状況はこのコマに集約される… (集英社 魔風が吹く 2巻) why 大事な課題を完全に出し忘れたので強く反省する 原因 リモートだからこそ常に Teams/Assignment 開いて Trello に書き込んで Google Calendar にやる予定と期限書いて、Dotcampus 開いて 一つ…

もう一回 Next.js

set up nextjs.org npx create-next-app next-2020 --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter" 2020年最後のってことで作る 404 This page could not be found. は???? 3001 を開けた first-post p…

react-intl を学ぶ

https://youtu.be/YrWRxs-lqj4 IntlProvider index.js の return のナカに書いて 全体を 包んでいる。 locale と message を渡している ここが実際は context の type lang になってく FormattedMessage FormattedMessage をいきなり使って id に色々指定し…

TS を学ぶ

index Primitive, Literal, interface(obj), function, class, の type のことを調べて書いた why zenn.dev export type locales = "ja" | "en"; interface LocaleProviderProps { lang: locales; } type で作って interface に組み込むのか? context での…

よく使う Git Alias

why よく忘れるからまとめる .bashrc に入れてある g : git g から始まるコマンドは git しか使ってないのでまず省略する gc: git checkout ブランチ移動は毎日するから入れた よくこれを使う gc -b NewBranchToMakeAndMoveToIt gcm: git checkout master よ…

React Props Passing by (Class, Function, Arrow Function, )

why React Class 記法の props の話がわからなくなった Class での基本表示 import React, { Component } from 'react'; class App extends React.Component { render() { return ( <div>hoge</div> ); } } export default App; これで hoge だけ 表示できる。 ここから…

Next.js Tutorial で作った blog サイトの見た目を自分好みにする計画

why デザイン変更終えてデプロイした!https://t.co/DfRoG1GX4z pic.twitter.com/qbA7UwklxD— TaKO8Ki (@TaKOBKi) November 3, 2020 これを見て私もはてなや Qiita の記事を並べたくなった 現状 Nextjs-tutorial で作ったそのまま 中身も入れてない。 purpos…

Ubuntu を Win マシンの空きドライブにインストーする

USB メモリに Ubuntu20 の iso ファイルを DL ubuntu.com ここにアクセスして Ubuntu Desktop を DL Ubuntu 20.04.1 LTS の ISO を DL 2.6GB もある... Win のドライブベイに SSD を追加 ケーブルが不適格 1TB の SSD を使います

Windows に WSL で Ubutnu 20 をいれて Node.js や CRA を動かす

why dual boot よりも、マシン開けて SSD 追加するのも手軽だったためこれから始めた result WSL で Vim, Node.js, CRA が簡単に入った 手順 Windows Store から Ubuntu の LTS を検索して install ubuntu.com 公式にコマンドを打てと書いてあるのを読む To …

Docker compose で postgres + adminer を動かす (stack swarm を削除して)

why [qiita stack aritcle] 前回間違えて stack.yml 書いて docker stack deploy で swarm で動かしてた 今回はまず compose.yml 作って compose up でうごかす code # Use postgres/example user/password credentials version: '3.1' services: db: image:…

MySQL の Parent Child RDB とは何か

why 仕事で、Blitz SQL の Questions と Children の 関係を 「階層構造」と表現して日報に書いたら、メンターから「言い方違いますよ」とのレビューが入った ググって記事を読んで見たら Why Should We Use Parent-Child Relationships とか言う根本的なセ…

Next.js で ビジネス定型文生成アプリを作り直す

why hashicorp の人のいつ next.js を使うべきではないか?というセッション、オチが use next.js for everything だった#NextJsConf— SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED (@mizchi) October 27, 2020 Next.conf stage X で "全て Next.js で…

Windows で Docker が failed to start

qiita.com win では、hyper V に乗せて Docker を動かす必要があるらしい、やってみる hub.docker.com ここから Docker を install した sign in する タスクバーにあるDockerのアイコンを右クリックし、「Settings」をクリックする。 なんか赤くね?なんか…

Win を可能な限り Mac ライクに使うために

ctrl space であ/A 切り替え とくに Mac US キーボードだと 半角全角 キーがないから 毎回 あ/A を右下にクリックしないと変更できずに高ストレスだった fshianasan.hateblo.jp こちらのサイトを参考にした まず右下にある あ/A を右クリック、設定、全般、…

Mac での音声再生-Elmedia / Google Drive

why リモート講義の音声再生に困っていた finder から space で起動するものは stop の感覚で space 押して閉じてイライラする Music player はうまく開かない Elmedia Download free video player for macOS - Elmedia Player Elmedia を入れてみた https:/…

react copy to clipboard しようとする

why for easy biz mail reedbarger.com import React from "react"; import copy from "copy-to-clipboard"; export default function useCopyToClipboard() { function handleCopy(text) { if (typeof text === "string" || typeof text == "number") { cop…

PC と SP のタブのアイコン(favicon) を React App に導入した

why icon 作成サイトでそのまま持ってきたら苦戦したからしるす easy-biz-mail でアイコンが欲しくなって作った 結論 React の場合は? / のところを ./ に変更しないとダメ index の head と manifest で指定されるのでそこを変更する React では android-c…

Rails での URL-controller/action のルーティングをする

前回の復習 Puma starting in single mode... * Version 4.3.6 (ruby 2.6.1-p33), codename: Mysterious Traveller * Min threads: 5, max threads: 5 * Environment: development * Listening on tcp://127.0.0.1:3000 * Listening on tcp://[::1]:3000 Rai…

デスク作業環境のバックのラックを最適化した

フロントエンド フロントが今こうなっている バックエンド ラックの構成を引越し前から最適化していなかったので、中途半端な隙間が空いていて、ものが効率的にしまえていなかった。充電もしにくかった。これを今回は改善する 設計図を Miro でちゃんと作っ…

mui で Form を綺麗に作る

why 敬語簡易化アプリで CSS が必要になったから興味を持ってた MUI を使ってみる www.youtube.com この動画が分かり易そうだったので参考にする material-ui.com これが公式ドキュメント install material-ui.com npm install @material-ui/core + @materia…

CSS で中央揃えのカードを作る

why kei-s-lifehack.hatenablog.com 便利アプリを作りたくなった 中央に全てが寄っていて欲しかった Chrome extension の care your eyes も動いて欲しかった それの中央揃えになぜか苦戦したので書いておく このテキストのみの html を css で中央に揃える…

react-hooks で ビジネス文書作成アプリを作る

理由は README github.com branch 仕事のスキルに活かすため、master 一本でやらずに feature ブランチを作る dev.to feature/integrate-swagger feature/JIRA-1234 feature/JIRA-1234_support-dark-theme こうやってつけるらしい git checkout -b feature/c…

Blender で円柱と球を綺麗に合体させる

基盤となる形の 立方体、円、球、円柱、円錐、ドーナツ型、モンキーなどをオブジェクトモードで置いておいて、 そこから編集モードで作っていくというのが主ですね〜! 横置きの円柱をまず作る 最初の立方体の削除 https://w.atwiki.jp/blender_tutorial/page…

Docker で Ubuntu bash の特定のコンテナを使い続ける

why docker-comopse が業務で必要になったが、Docker が Apache と混じるくらい理解が浅いので、基礎の勉強の必要性を感じた ちょうど Twitter で米国データサイエンティストの かめさん がセールしてた 人気の udemy 講座を買っていたのでやった twitter.co…

Blender をやる

why EVA が Blender を採用したと聞いて GANTZ や チェンソーマン cyberpunk 2077 をみて install 450MB くらいしか使わなかった。 とりあえずポチタでも作ってみたい manual docs.blender.org マニュアルを読む window system docs.blender.org Window Syst…

VScode を久しぶりに使うので設定をまとめておく

why TS を使う必要性が出てきた 共通設定 "editor.fontSize": 16 "files.autoSave": "afterDelay" 文字が12では小さいから16にする 最初は自動保存が有効化されていないから設定をしなければいけない Vim からの以降 とりあえず簡易的に Vim setting の GUI …

朽ちる技術とその必要性

僕らが食べるために技術は朽ちていく www.orangeitems.com 衝撃的なタイトルだったから読んでみた 引用しながら感想や自分の理解を添えて書くスタイルを取る。 今もってC++を未だに利用しているプログラマーもたくさんいるとは思いますが、今はPython、JavaS…

なぜ Excel がダメか

why よくExcelがクソだという意見は目にするし、私もExcelに殺意を覚える。 まとめておく場所を作ろうと思った Twitter で見た意見 Excelでも郵送でも、たいして作業効率変わらない気もする。絶対良くわからん書き方されたxmlファイル届くよ。故意であるかど…

CSS やることリスト

why kei-s-lifehack.hatenablog.com これを作っていて全然CSSをrelative にかけなくてやばいと感じた todos reset css /** * Reset CSS */ *, ::after, ::before { box-sizing: border-box; } html, body { border: 3px #000 black; margin: 0; padding: 0; …