KEISUKE KURITA

栗田啓介と申します。都内のとある大学に通っていました。 noteでは、プログラミングや…

KEISUKE KURITA

栗田啓介と申します。都内のとある大学に通っていました。 noteでは、プログラミングやブログに関する記事を書いています。 自分の勉強したことや、ぶち当たった壁についてのメモを主に残します。

マガジン

  • JavaScript勉強日記

    自分がJavaScriptについて勉強して、ためになったなと感じたプログラムの知識をひたすら書き残すマガジン。

  • 雑学日記

    自分の考えたことや、メモに残しておきたいことをひたすら更新するマガジン。

  • PHP勉強メモ

    PHPについて自分がハマったことや、ためになったと思うことをひたすらに書きなぐるマガジン

  • ブログ運営メモ

    僕のブログの運営状況についてメモをしていきます。アクセス解析や分析することで得られる運営方針の決定について残していきます。 『建築学科のための材料力学』:https://materialmechanics.work

  • 基本情報技術者試験 勉強メモ

    基本情報技術者試験に向けて勉強を行い、そこで覚えておきたいことをアウトプットすることで自分の理解を深めようとするメモ

記事一覧

Vueのカスタムディレクティブでパララックス(視差効果)を実装する

Vuetifyにあるようなパララックスをプラグインを導入せずに実装したのでその際のメモnoteを残します。 カスタムディレクティブを登録今回はパララックスを実現するためにV…

1

Vue + SVGでセル・オートマトンルール30を描く

セル・オートマトンについて触れる機会があり、実際に手を動かしてみた方が勉強になるかと、学習してみたのでそのメモnoteを残します。 セル・オートマトン?ウィキペディ…

3

marked.jsでimg(画像)に共通のクラスを追加する

意外と調べてみてもやり方が載っていなかったので、自分用メモを残します。僕の場合はBootstrapのimg-thumbnailクラスを全<img>タグに追加したかったので、そんな時は let…

1

シンボリックリンク 403 Forbbitten & Symbolic link not allowed or link target not accessible

シンボリックリンク設定につまづき、3日間浪費してしまいました。次同じような場面に遭遇したときのための、解決メモnoteを残します。 エラー内容シンボリックリンクを利…

1

LaravelでMaterial Design Iconsを使う

自分用メモnote。 npm経由でインストール$ npm i mdi app.scssの編集@import '~mdi/scss/materialdesignicons.scss'; // こいつを追加 アイコンを表示<i class="mdi mdi…

Laravel + Vue + Axiosでmultipart/form-dataをPUTする

タイトル通りの記事ですが、若干つまづいたことがあったためメモを残します。 クライアント側ポイントは_methodパラメータをつけてあげることと、postで送信することです…

Laravel5.8でMaterial Design for Bootstrapを使う

意外とインストールのやり方を記載している日本語の記事が少なかったので、自分用のメモも兼ねてnoteを残します。今回はMaterial Design for Bootstrapを使用します。 実…

MacでWindows環境でも文字化けしないZIPファイルを作成

Qiitaで非常にわかりやすい記事があったのですが、自分のようなパソコンわからない人間に向けてよりメモを残します。 Macで圧縮したファイルをWindowsで開くと文字化けす…

1

Laravel + Vue CLI 3でバックエンドカスタマイズ可能なSPAを作る

「Vue CLI 3でrouterを使ったSPAを作りつつ、バックエンド側はLaravelで自在に作りたい!」という願望を前から持っており、実際にやってみたのでメモを残します。 こちら…

Laravel + Vue + MySQLで簡易投票機能を作る

下の画像のような簡易投票機能を作ったので、そのメモを残します。 作成したものは、こちらから試してみてください。想定した要件は以下のようなものです。 要件s ・投票…

2

Twitter運用と画像付きツイートの注意点

8月のブログ運営メモを残します。 運営サイト:建築学科のための材料力学 Twitter:@mtl_mechanics Twitterフォロワー100人達成2019年1月に始めたブログ用Twitterのフォ…

2

Google Analytics(gtag.js)でイベントトラッキングを送信する

普段からGoogle Analyticsを利用してサイトのアクセス情報を収集していましたが、イベントトラッキングという便利な機能があるようで試してみましたので、そのメモnoteを残…

フロントページアクセス遷移とアドセンス広告ユニット管理

7月のブログ運営メモを残します。2019年の5月にブログのフロントページを編集しました。 フロントページを編集する前は、フロントページにWordPressのデフォルトである新…

【2019年6月】フロントページとリターニングビジター(リピーター)

6月のブログ運営メモを残します。5月下旬に運営サイトのフロントページを編集しました。 編集前は、フロントページに新規投稿一覧を表示していました。サイトの記事が100…

1

TinyMCE5とPHPで画像アップロード機能実装【ロリポップ】

TinyMCE5で画像アップロード機能を追加するのに躓いたので、その解決策メモを残します。こちらのnoteはすでにTinyMCE5を導入済みで、更に画像アップロード機能を実装したい…

3

MacのXAMPPにLaravelをインストールする

標題通りの内容なのですが、いくつかつまづいたことがあったのでメモnoteを残します。 実行環境 MacOS Mojave 10.12.5 XAMPP for Mac 7.1.12-0 XAMPPからターミナルを開…

Vueのカスタムディレクティブでパララックス(視差効果)を実装する

Vuetifyにあるようなパララックスをプラグインを導入せずに実装したのでその際のメモnoteを残します。

カスタムディレクティブを登録今回はパララックスを実現するためにVueのカスタムディレクティブを使用し、再利用性を高めたものを作ります。こんな感じ:

const app = new Vue({ el: '#app', directives: { parallax:

もっとみる
Vue + SVGでセル・オートマトンルール30を描く

Vue + SVGでセル・オートマトンルール30を描く

セル・オートマトンについて触れる機会があり、実際に手を動かしてみた方が勉強になるかと、学習してみたのでそのメモnoteを残します。

セル・オートマトン?ウィキペディアより
セル・オートマトン(英: cellular automaton、略称:CA)とは、格子状のセルと単純な規則による、離散的計算モデルである。計算可能性理論、数学、物理学、複雑適応系、数理生物学、微小構造モデリングなどの研究で利用

もっとみる

marked.jsでimg(画像)に共通のクラスを追加する

意外と調べてみてもやり方が載っていなかったので、自分用メモを残します。僕の場合はBootstrapのimg-thumbnailクラスを全<img>タグに追加したかったので、そんな時は

let renderer = new marked.Renderer();renderer.image = (src) => { return `<img src="${src}" class="img-thumb

もっとみる

シンボリックリンク 403 Forbbitten & Symbolic link not allowed or link target not accessible

シンボリックリンク設定につまづき、3日間浪費してしまいました。次同じような場面に遭遇したときのための、解決メモnoteを残します。

エラー内容シンボリックリンクを利用して、画像ファイルを表示したかったのですが、Chromeの開発者ツールにこんなエラーが表示されていました。

403 Forbbitten

「アクセス権がありません」ってことですが、シンボリックリンク先のパーミッション等を確認して

もっとみる

LaravelでMaterial Design Iconsを使う

自分用メモnote。

npm経由でインストール$ npm i mdi

app.scssの編集@import '~mdi/scss/materialdesignicons.scss'; // こいつを追加

アイコンを表示<i class="mdi mdi-home"></i>

おしまい。

Laravel + Vue + Axiosでmultipart/form-dataをPUTする

タイトル通りの記事ですが、若干つまづいたことがあったためメモを残します。

クライアント側ポイントは_methodパラメータをつけてあげることと、postで送信することです。

export default { data() { return { userId: '', userName: '', avatarImageD

もっとみる

Laravel5.8でMaterial Design for Bootstrapを使う

意外とインストールのやり方を記載している日本語の記事が少なかったので、自分用のメモも兼ねてnoteを残します。今回はMaterial Design for Bootstrapを使用します。

実行環境
Laravel 5.8.35
Node 10.12.0
npm 6.4.1

mdbootstrapのインストールはじめにnpm経由でmdbootstrapをインストールします。

$ npm in

もっとみる

MacでWindows環境でも文字化けしないZIPファイルを作成

Qiitaで非常にわかりやすい記事があったのですが、自分のようなパソコンわからない人間に向けてよりメモを残します。

Macで圧縮したファイルをWindowsで開くと文字化けするMacのFinderから圧縮したZIPファイルをWindowsで開くと文字化け問題に直面しました。ということで、自作コマンドでWindowsで開いても文字化けしない圧縮ファイルを作成しましょう。

ターミナルからファイル作

もっとみる
Laravel + Vue CLI 3でバックエンドカスタマイズ可能なSPAを作る

Laravel + Vue CLI 3でバックエンドカスタマイズ可能なSPAを作る

「Vue CLI 3でrouterを使ったSPAを作りつつ、バックエンド側はLaravelで自在に作りたい!」という願望を前から持っており、実際にやってみたのでメモを残します。

こちらのnoteはVue.jsの開発者であるEvan YouさんのGItHubを参考にしています。

実行環境
macOS Mojave 10.14.6
PHP 7.1.23
Composer 1.8.3
Node.js

もっとみる
Laravel + Vue + MySQLで簡易投票機能を作る

Laravel + Vue + MySQLで簡易投票機能を作る

下の画像のような簡易投票機能を作ったので、そのメモを残します。

作成したものは、こちらから試してみてください。想定した要件は以下のようなものです。

要件s
・投票は1IPアドレスにつき1回
・<form>ではなくaxiosの非同期処理で実装

前提として、LaravelでVue・axios・Bootstrap・FontAwesomeが使えるものとします。(BootstrapとFontAweso

もっとみる
Twitter運用と画像付きツイートの注意点

Twitter運用と画像付きツイートの注意点

8月のブログ運営メモを残します。

運営サイト:建築学科のための材料力学
Twitter:@mtl_mechanics

Twitterフォロワー100人達成2019年1月に始めたブログ用Twitterのフォロワーが、8月中に100人を達成しました。

ブログ用Twitterは、毎日定時に作成されたツイートコンテンツからランダムに1つツイートするBotアカウントです。こちらはTwitterからブロ

もっとみる

Google Analytics(gtag.js)でイベントトラッキングを送信する

普段からGoogle Analyticsを利用してサイトのアクセス情報を収集していましたが、イベントトラッキングという便利な機能があるようで試してみましたので、そのメモnoteを残します。

こちらのnoteで記載する内容は、アクセス解析にgtag,jsを利用している方法です。analytics.jsではありませんので、ご注意ください。

イベントトラッキングとはGoogle Analyticsの

もっとみる
フロントページアクセス遷移とアドセンス広告ユニット管理

フロントページアクセス遷移とアドセンス広告ユニット管理

7月のブログ運営メモを残します。2019年の5月にブログのフロントページを編集しました。

フロントページを編集する前は、フロントページにWordPressのデフォルトである新規投稿一覧を表示していました。自分が運営しているブログが勉強系の解説サイトであったので、ユーザーのアクセシビリティの向上を目的として、フロントページをサイトの目次へと追加しました。

▽▽▽編集後のフロントページ▽▽▽

もっとみる
【2019年6月】フロントページとリターニングビジター(リピーター)

【2019年6月】フロントページとリターニングビジター(リピーター)

6月のブログ運営メモを残します。5月下旬に運営サイトのフロントページを編集しました。

編集前は、フロントページに新規投稿一覧を表示していました。サイトの記事が100を超えたこともあり、ユーザーのアクセシビリティの向上のため、新規投稿一覧から、サイト目次へとフロントページを編集しました。

↓↓↓編集後↓↓↓

フロントページの編集によって、ユーザーにどのような変化が現れたかをこちらのnoteでは

もっとみる
TinyMCE5とPHPで画像アップロード機能実装【ロリポップ】

TinyMCE5とPHPで画像アップロード機能実装【ロリポップ】

TinyMCE5で画像アップロード機能を追加するのに躓いたので、その解決策メモを残します。こちらのnoteはすでにTinyMCE5を導入済みで、更に画像アップロード機能を実装したい人向けです。

僕が作りたかったのは、まさにWordPressのようなWYSIWYG(見たままに編集)エディタです。単純なTinyMCEだけでも、pタグやaタグを含んだHTMLの生成が可能ですが、やはりそこまでできると画

もっとみる

MacのXAMPPにLaravelをインストールする

標題通りの内容なのですが、いくつかつまづいたことがあったのでメモnoteを残します。

実行環境
MacOS Mojave 10.12.5
XAMPP for Mac 7.1.12-0

XAMPPからターミナルを開くXAMPPコントロールパネルから、[Open Terminal]をクリックしてターミナルを起動します。

ターミナルを開いたら、開発ディレクトリに移動します。僕の場合は、opt/la

もっとみる