エンジニアの卵の成長日記

https://blog.toru-takagi.dev/profile/

スマホのWebブラウザで画像が荒い原因とは?

1. 背景
2. 目的
3. 調査結果3.1. 解像度の意味は2つある3.2. 解像度3.3. ピクセル/dpi/インチの関係3.4. Retinaディスプレイ登場3.5. Retinaディスプレイでの解決策4. 結論
5. 感想
6. 参考文献


1. 背景

バイト先で,スマホのブラウザでWebサイトを表示すると,画像が荒いという問題があった.

kurowasi2525.hatenablog.com

上の方は,ピクセルサイズを大きくすることなく,解像度を上げることで解決したい.

僕は,ピクセルサイズを大きくしないと画質は上がらないと考えていた.

続きを読む

Windows10でPleiades All in Oneを使わずにEclipseの環境を構築した

概要

Selenium WebDriverを使うため,Eclipseの環境が必要なので構築してみた.


目次

1. 背景
1.1. Seleniumとは1.2. Selenium WebDriver1.3. Eclipse2. 目的
2.1. Pleiadesを利用しない理由3. 環境構築
3.1. Eclipseのインストール3.2. Javaプロジェクトの作成3.3. クラスの作成3.4. HelloWorldコードの記述3.5. 実行4. 感想
5. 参考文献


1. 背景

卒業研究でSeleniumSelenium WebDriverを使うため,Eclipseの環境が必要なので構築してみた.

WebDriverの言語はJavaにした.

本当はNode.jsにしたかったのだが,僕の内定先はJavaのシステムで,

Seleniumを使っているみたいなので,目先の利益を追ってJavaを選んだ笑.

続きを読む

Laradockを使っていて、Postgresに接続できなかった問題

目次
1. 背景
2. 解決策
3. 余談


1. 背景


バイト先でLaradockを使っているのだが,Postgresに接続できない問題があった.

ローカルからLaradockでのPostgresに

 ホスト:localhost
 ユーザ:default
 パスワード:secret
 ポート:5432
 データベース:default

で接続しようとするとできなかった.

ローカル環境には,Laradockで作ったものではなく,brewコマンドでインストールしたPostgresが起動していた.

brewコマンドで入れたPostgresに対しての接続はできた.

同じポート5432に2つ作ることはできないだろうけど,

ここらへんはDockerの知識が足りないため,勉強しようと思います.

brewコマンドで起動したPostgresを落とせばいいのだろうが,

こちらも違う環境で使っていて,デーモン化?で自動起動するようになっているので,

後で面倒になりそうだから,止めたくない.


ワークスペースに入って,Postgresに接続しようとするが,

以下のようなエラーが出る.

$ docker-compose exec workspace bash
# psql -l

psql: could not connect to server: No such file or directory
Is the server running locally and accepting
connections on Unix domain socket "/var/run/postgresql/.s.PGSQL.5432"?psql: could not connect to server: No such file or directory

/var/run/ ディレクトリまでは存在するのだが,postgresqlというディレクトリは見当たらない.

色々調べて,試したのだが解決しない.

続きを読む

バイトでRepositoryパターンを使ったよ

今日のタスクは前回の続き
kurowasi2525.hatenablog.com


前回はIoCとは何かなどを理解できていなかった
この一週間の暇な時間で

を読んでIoCやDIを勉強したから大丈夫だろう
(この本はLaravelの概念系が書いてある本。パソコンの前でカタカタやりながら読む本ではないですね)
(電車などで読むのには適していると思う)


qiita.com


1. まずはModelに対応するRepositoryを作成
(今回はすでにRepositoryが作成してあった)

2. 次にControllerに対応するアプリケーションを作成

3. Service Providerに作成したアプリケーションをmake&bind

4. 次にControllerに対応するReponseを作成

5. Service Provideに作成したReponseをmake&bind

6. 次にControllerに対応するResponseを作成

7. Service Provideに作成したResponseをmake&bind



一応流れが完成した
後はvalidationを行う機能・DBに情報を記録する機能を作成するのみ



Laravelのvalidationについて調べていこう


こちらの記事が便利そう
qiita.com



DBの仕様と詳細設計の仕様を見ながらValidationコードを書いていく

上記の理由により、まぁまぁ適当な感じで完成

その後DBに情報を記録する機能の作成も終わり



リポジトリーパターンというか、今回のプロジェクトのルールに従うのに大きく時間を取られました
今回のは、

自作のControllerは、【自作のApplication】と【自作のRequest】と【自作のResponse】と【Request】と依存関係
自作のApplicationは、【自作のRepository】と依存関係

みたいにとても複雑になっていた
(上記の書き方で合っているのかわからない)

久しぶりにNVMを使ってNodeの環境構築を行って、Laravel5にはCSRFチェックを行ってるって知りました

NVMを使ったNodeのバージョン管理できる環境構築
※環境構築手順書の記事ではありません。
※正しい手順でやりたい場合は、他のサイトを読むことをお勧めします。


最初は別プロジェクトの環境構築から
フロント側をVue.js バック側をnodeのexpressを使うらしい
expressは昔に使ったことがある。Vue.jsは触りたいと思っていたからすごい嬉しい



まずは、npmを入れよう
会社のPCにはbrewが入っているから、今回はbrewを使って入れよう

$ brew --version
Homebrew 1.2.1
$ brew install node


あ。。。brewのupdateするのを忘れてた。。。
いつも先にupdateをするんだけど、まぁいいか

node 5.3.0 is already installed


あれ?もう入ってるやんけ笑

$node ls-remote


なんでエラー吐くんやって思ったけど、nvmだったわ笑
久しぶりすぎて色々忘れてた笑

nodeは入ってたけど、nvmが入っていないので入れていきます

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash

.bash_profileの中身を見たけど、pathの設定がしてあった
Why? 勝手にやってくれるようになったの?


Gitからプロジェクトをcloneして、npm install

なんかnodeのバージョンが変みたいなエラーが出てた気がする

$npm run hoge

起動しない。。。webpack関係のエラーみたい
nvmでnodeのバージョンを変えて色々やってみる
(バージョンの指定がしていない環境構築手順書ってどうなん?)


色々やってみたけど
nodeのバージョンをv6.11.2にして、エラーが出まくっててよくわからなかったので、
エラーに書いてあったコマンドを実行
バージョンの違いによって起きた問題をリビルドして直す感じ?

npm rebuild node-sass --force


正直何が問題だったのかよくわかりませんでしたが、
うまく動作するようになりました


多分、npm installをした際のnodeのバージョンが古くて、うまくモジュールをインストールできていなかった?
nodeのバージョンをあげて、リビルドすることでいい感じの環境になったのかな?


環境構築は完了
次の作業に移る





Laradockのシステムの修正
次は前回の続きで、Laravelの案件

アプリケーションからDockerを起動して、
Laradockを起動

$docker-compose up -d apache2 postgres
$docker ps

URLにアクセスして、ちゃんと表示される
では、GitHubから最新verを持ってこよう


なんかめちゃくちゃコンフリクトしてる。。。

$git reset --hard

とかやっても、ローカルの変更が元に戻ってもpullしようとするとコンフリクトが起きて
もう一度statusを見てみると、新しいファイルと変更だらけ。。。

よくわからないから、社員さんに聞いたけど、
削除して、もう一度クローンした方が早いよと言われてそうすることに
Laravelのバージョンを変えたのがコンフリクト大量発生の原因らしい


あまりこういうパワー系は好きじゃないけど、やるか
調べたいけど、一応バイトだから給料もらってるわけだし、自己満足にお金をもらうわけにはいかない
最短時間でできるならそれをやらなければ


元に戻った
DBのMigrationをするみたい
MigrationはNodeでしかやったことないから、PHPではどうやってやるんだろう
laravel Migration 検索検索!


どうやら

$php artisan migrate

でいけるみたい


DBに接続しようとしてSequel Proを使ったんだけど、これってPostgres対応していないんだね笑
今まで会社でもプライベートでもコマンドでやってたから知らなかった

PSequelがいいみたいなので、これをインストールしてみる


PSequelを使って接続を試みたが、なぜか失敗
コマンドで接続を試みるが、失敗
だけど、今回のシステムを立ち上げてPostgresからデータを取ってくる画面に行くと、
ちゃんとエラーは起きていない(データベースを作っただけで中身は入れてないから、表は空白)


色々調査したんだけどわからなかった
自分の中の結論は、他のプロジェクトでPostgresを扱っていて、そいつがデーモンで動き続けている
よって、接続しようとすると、そっちに接続しようとして、そのUsernameはないよと言われるって感じ
でも、なぜ二つのDocker環境のPostgresに直接接続する方法を今度調べておこう


とりあえず、情報を登録する画面の作成に入る




色々あったけど、今回知ったのはLaravel5からPOST送信でCSRFチェックってのを行っているらしい
だから、Formの中にCSRFトークンを渡すコードを書くみたい
» Laravelのフォーム送信で「TokenMismatchException in VerifyCsrfToken.php」エラーの対処方法。|コワーキングスペース管理人のブログ


感想
LaravelでDBに登録する画面を作成していて思ったのは、Laravelの知識がとても足りていない
そして、IoCなどの概念を理解できていないということ

今度調べてブログに書きたいと思う

Chrome62からHTTPページのinputタグに警告が表示されるようになるらしい

はじめに

Web系Developerの方々にGoogleさんから悪魔のメッセージがきてるみたい
Twitterで結構話題になってた

Chrome62でHTTPページのフォームにテキストを入力すると、
「保護されていません」という警告が表示されるようになります。
また、シークレットモードを使用している場合は、
HTTPページにアクセスするだけで「保護されていません」と表示されます。

長期的には、HTTPで配信されるすべてのページを「保護されていません」と明示することを計画しており、
この新しい警告はその一環です。


Flashなくすぞ!Flashなくすぞ!Flashなくすぞ!
の次はHTTPSにするぞ!を本格的に開始するみたい


inputの警告が出るってことは、ほとんどのサイトをSSLに対応させなきゃいけないから結構面倒だね


小学校時代の同級生は、投稿した記事のFacebookのいいねが全部消えてしまうのを残念がっていた
まぁ対策はあるみたいだけど、結構面倒みたい(鼻ほじ)


感想

僕がこの流れを見て思ったことは、SSLって安全なの?ってこと
GoogleさんはHTTPSへの流れにもってこうとしてるけど、
前に僕が研究室友達に聞いた話だと、
SSLには重大な脆弱性がありTLSへの移行の流れが来てる』っていう話を前に聞いた



jp.globalsign.com



僕はSSL/TLSとかのセキュリティ関係は詳しくないので、よくわかりませんが
SSLに移行させておいて、すぐにTLSに変えてね!』とかになったら面倒だろうな
(SSLからTLSに変えるのが難しいのかもよくわかってない)


誰か詳しい方いらしたら教えてください!笑

AdminLTEってのを触ってみたよ

はじめに

今日はネイティブアプリを管理するためのWeb管理画面の機能追加がお仕事

まずは前回構築したLaradockを起動しよう!

$ docker-compose up -d apache2 postgres

エラーが出た

ERROR: Couldn't connect to Docker daemon. You might need to start Docker for Mac.


Docker for Macってインストールしたらパソコン起動時に勝手に起動するのかと思ってた
自動起動の設定があると思うけど、家に帰ってから調べることにしよう


Laradockの起動もできたし、URLにアクセスしたらちゃんと表示される
これで準備完了!
けど、今回のシステムの情報を全く知らないからドキュメントを読んでいこう


社員さん曰く、できるだけパーツ化してやって欲しいとのこと
見た目はAdminLTEを使っているらしい(初めて聞いた)
表が多いためうまくパーツ化できていないらしい
(現在はテーブルで実装)
テーブルはあまり好きじゃないからFlexかGrid Layoutを使いたいところ
(前勉強したけど、その後使ってないから使ってみたい笑)

kurowasi2525.hatenablog.com

続きを読む