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

JAMStackMeetUPいってきた

JAMSTACK Meetup #1 with microCMS 所感 全体を通して JAMSTACKについて というかはmicroCMSのサービス紹介(宣伝だった) microCMS(ヘッドレスCMS)はビューを外部で作れるから自由度高い サイト作る側は、記事作成だけに専念できる LTのが宣伝なくてよか…

Angular勉強会いってきた

2020年の私とAngular 途中から入った Angular 日本ユーザー会 staff による座談会 lacolacoさん 現場感覚のAngularがわかっってきた なので現場目線での解決策というか考え方の原理を解き明かしていく 昨年はClassiに踊らされた一年だったから PJをリプレー…

Webソケット接続

Webソケット接続 概要 特徴をわかりやすくいうと Webソケット接続とは、トンネルによく例えられる クライアント・サーバ間で、認証無しで随時データをやり取りする通信方法 本来クライアントの立場・サーバの立場で主従関係を結ぶのがTCP/IP通信 WebSoketを…

CSSグリッドデザイン

ページ構成 画面分割をCSSでやる サンプルコード /* コンテナ */ #container { display: grid; grid-template-rows: 50px 100px 570px; grid-template-columns: 1420px; } /* アイテム */ #itemA { grid-row: 1 / 2; grid-column: 1 / 2; background: #AD8; …

Webフレームワーク勉強会

Laravel 6.x のLaravel UIとAuth実装 概要 Laravel UIとは 5までデフォルトで入ってものが分離された Larael5.8->6の違い 5.8ではBootstrapがあった 最初からViewがあった Make AuthコマンドでViewがつくらた Laravel6からLaravelUIいれないと、上記がはいら…

AngularのRXJS

RXJSを用いた非同期 概要 どんな方法 ストリーム(川によく例える川には魚やごみがながれるからデータをそれらにたとえるみたい)とその観測者間でデータをやりとりする方法 イベント処理、非同期プログラミングに使える手法 観測型フロー 登場人物は、ほか…

Locust環境 ローカル確認

負荷試験環境 MAC 環境 準備 brew install libev brew install python python3 -m pip install locustio $vi ~/.bash_profile export PATH=/usr/local/bin:$PATH source ~/.bash_profile python3 -m pip install locustio # ファイル名を指定する場合 $ locu…

oAuthとMTLSのまとめ

フィンガープリント(Finger print) 電子メールの内容やデジタル証明書などが改ざんされていないことを証明するデータのこと やりかた:クライアントとリソースサーバ間のTLSコネクション内の証明書と、アクセストークンが一致しているかで、改ざんを判断 O…

AngulaのFormGroupについて

FormGroup AngulaのForm内のタブをグルーピングする html 以下サンプル <div class="free" [formGroup]="listSearchForm"> <input type="text" class="form-control" (keyup.enter)="onEnter()" formControlName="freeWord" /> </div> component import { Component, OnInit, Input, AfterViewInit } from '@angular/core'; import { FormGroup,…

Angularおさらい

最初にapp.moduleに記載する要素 @NgModuleに記載する基本要素の備忘録 declarations : ディレクティブ(含むコンポーネント、パイプ)を記載 htmlテンプレートに書くこと providers : Serviceなど、DIで解決するものを記載 imports 外部のAngularモジュール…

サーバレス勉強会のノート

コーポレートエンジニアから見た Serverless ServerlessでETL Extract/Transform/Load(抽出したデータを変換/加工した上でデータウェアハウス等へ渡す処理) 背景 アクセスログをBIツール内で加工して保存を行なっていたが膨大すぎる 目的 的確な量に正規化…

github リマンドシート

gitコマンドこれだけ抑えよう 基本 現在リポジトリの派生元 派生元がdevelopだとdevelopとでる git show-branch | grep '*' | grep -v "$(git rev-parse --abbrev-ref HEAD)" | head -1 | awk -F'[]~^[]' '{print $2}' ブランチからブランチ developブランチ…

Angularマテリアルデザイン

AngularMaterial試す 概要 説明 Angularで表現したマテリアルデザイン ちゃんとしたWWなんとかってデザイングループが作成しているので品質高い インストール いるもの $ npm install --save @angular/cdk $ npm install --save @angular/material @angular/…

ProtocolBuffers

ProtocolBuffers 概要 説明 インタフェース定義言語 (IDL) で構造を定義する通信や永続化での利用を目的としたシリアライズフォーマット 具体的な方法 シリアライズの問題に対して柔軟で, 効率的, 自動的 な解決策を示すことができます。 .protoファイルに保…

Bazelを使ってGoをビルド(その1)

Bazel メリット 正確性 Isolateな環境でBuildを実行する Bazel RuleがInputだけアクセスできる 高速 Declarative、そしてBazelが依頼関係を分析できます。変更があったら、影響する部分だけ再Buildすることができます。 BazelがPure Functionで、アウトプッ…

npm script 作成

npm script 作成 qiita.com poppingcarp.com

Angularライフフック

親コンポーネント import { Component, OnInit } from '@angular/core'; // ngAferViewInit と ngAfterViewChecked を利用するための import import { AfterViewInit, AfterViewChecked } from '@angular/core'; // 子コンポーネントで定義されたプロパティ…

Dockerでport is already allocated

dockerを起動 port is already allocated ポートはもう割り振っちゃってエラーが発生 Bind for 0.0.0.0:3306 failed: port is already allocated ERROR: Encountered errors while bringing up the project. 解決策 見つけて終了 sudo lsof -i:3306 sudo kill…

jwt認証とo-auth認証は全く違うので混同しないこと

2つの認証 Basic認証 よくあるやつ ログインとパスワードで行う認証 O-Auth2.0 概要 簡単に言うとAPPサーバとは別に認可サーバをたてるか、使わせてもらってアクセストークンをもらう アクセストークンとはつまり入場券 これをもってAPPサーバにアクセスす…

Zapierとは

概要 アプリを組み合わせて独自のワークフローを作成できるタスク自動化ツール Zapierでできること Googleカレンダーに登録があったらSlackに通知 Gmailにメールが届いたら添付ファイルをDropboxに保存 Googleスプレッドシートに行を追加したらTrelloカード…

WebSocketおさらい

WebSocketの概要 概要 発端 HTTP以外の通信方式としてHTML5から登場 WebRTCなどもHTTP以外の通信方式 将来は TCP のソケット通信がでる 寄り道(WebRTC) ピア・ ツー・ピアを確立するまでの部分などは むしろ SIP(Session Initiation Protocol) NA…

Goの並行処理

Go routineの使い方 並行処理 スレッドとの違い ユーザーから見た場合、goroutine にはスレッ ドとは明らかに違う点がいくつか存在 channel によるデータの送受信 ID を持たない sync.Mutex による排他ロック