AMPを記述する際のCSSの書き方 テキストファイルとして読み込ませる AMPを記述する際のCSSの書き方 AMPでHTMLを記述する際、CSSは基本的に外部ファイルに分けて記述することはできませんよね。 例えば以下の書き方でスタイルシートを読み込もうとするとエラ…

Spring Data JPAについて SQLを記載したいとき 方法1: EntityManagerを使用 方法2: Repositoryで@Queryアノテーションを使用したメソッドを実装 Spring Data JPAについて みなさんSpring Bootを使用する場合、Spring Data JPAを使用してSQLを記載せずにDBを…

Spring Bootの定義ファイル Javaのソースで値を取得する方法 どんな時に使用する？ Spring Bootの定義ファイル Spring Bootでは、プロパティ値を設定する定義ファイルとして、application.ymlやapplication.propertiesがありますね。 設定する内容としては、…

ヒント句とは？ ヒント句の書き方 ヒント句の種類 ※ヒント句はMySQLでもありますが、今回はOracle SQLの話です。 ヒント句とは？ SQLのヒント句は、SELECT・UPDATE・INSERT・MERGE・DELETEのいずれかのキーワードの後に書かれるものです。 例えば/*+ ALL_ROW…

SQL Developerが不安定になる場合 Oracle SQLに接続するためのSQL Developerの動作が不安定の時の対処方についてです。 SQL Developerはクライアントツールとして非常に有用ですよね。 特にMacからOracleに接続できるものは少ないため、Macユーザには重宝さ…

nightwatch.jsとは nightwatch.jsはE2Eテストフレームワークとして最も有名なものの1つではないでしょうか。 開発したWebのアプリケーションに対して1つ1つ手動でテストをしていくのは大変なので、Seleniumでテストを自動化させることが主流になっていますが…

vue-slickを使用した場合のエラー エラーの解消法 解消法1 解消法2 Nuxtでは同様のエラーが発生するプラグインが多い vue-slickを使用した場合のエラー 複数画像のスライド表示を簡単に実装できるJavascriptのプラグインであるslick.js。 これをVueやNuxtに…

APIとして使用される場合を想定 GinのGors設定 許可されないアクセスがされた場合 CORS 対応の後にルーティングを書かないとうまく動かない APIとして使用される場合を想定 近年SPAサイトがよく作られており、サーバサイドの言語はAPIとして開発されることが…

herokuでGo Goのソースでやること 最終形(まとめ) herokuでGo herokuは非常に便利なPaasですよね。 アプリケーション開発では、せっかく開発が終わったのにも関わらず、サーバの準備でまた時間がかかってしまうのが面倒ですよね。 それほどインフラ面にこだ…

開発環境と本番環境を切り分けたい理由 GoのGinではどのように切り分ける？ 実装の中身 .envファイルを用意 godotenvのインストール import内にモジュールを定義 読み込み処理の実装 開発環境と本番環境を切り分けたい理由 アプリケーションの起動に当たって…

Vue.jsとNuxt.jsのrouterの違い Nuxt.jsでのルーティングは便利だけどデメリットも どうやってNuxtでルーティングをカスタマイズする？ metaの設定は？ Vue.jsとNuxt.jsのrouterの違い Vue.jsでは、ルーティングを設定する際にrouter/index.jsなどで自分で自…

文章どうしの差分を取得 モジュールのインストール コードの実装 文章どうしの差分を取得 文章の差分を取得するような機能を作りたい時、diff-match-patchを使えば簡単に実装することができます。 PythonやGo、PHPなど、各種言語にライブラリが用意されてい…

Javascriptのwindow.open 複数ページを開く時のネックになるポイント Javascriptのwindow.open Javascriptでaタグの「target=_blank」の要領で、別タブでページを開きたいことありますよね。 そんな時にはwindow.open('ここにURL', '_blank')を使えばOKです…

target="_blank" rel="noopener"を付けないとどうなる？ どんな場面で悪用されてしまうのか まとめ target="_blank" 外部ページへ遷移する際に使われるtarget="_blank"。 あまり知られていないのですが、そのまま使うと実はセキュリティ的なリスクをはらんで…

パスワード生成ツールがなぜ使われるのか 「パスワード 生成」で検索すると... え？お前はどうなのかって？ パスワード生成ツールがなぜ使われるのか 今の世の中、パスワードを設定する場面が多いですよね。 いろんなサービスで会員登録をしたりしますし。。…

QRコード生成機能は実装が簡単！ モジュールのインストール コードの実装 筆者が実装してみたページ QRコード生成機能は実装が簡単！ URLを入力してポチッとボタンを押せばQRコードが生成されるあの機能。 実際に実装してみましたが、超簡単にできたので共有…

Nuxtでソースの表示 extractCSSの設定を変更するだけで解決 Nuxtでソースの表示 ブラウザ上からページのソースを見ることができますが（Chromeで「ページのソースを表示」を実行する）Nuxtでソースを表示させた時にデフォルトの設定だとCSSが全部出力されま…

aタグのイベント イベントを止める方法が用意されている aタグのイベント javascriptでは数々のイベントを設置するもの。 ホバーした時、スクロールした時、、、など色々パターンはありますが、特に多いのはクリック時のイベントではないでしょうか。 そして…

ファイルを読み込む処理 FileInputStreamでファイルの内容を読み込み InputStreamReaderで指定した文字コードに FileReaderを使えばInputStreamReader要らず 旧来のファイルの読み込み方比較 方法1 方法2 BufferedReaderを使えば一行単位で呼び出し可能に Ja…

コンパイル言語の宿命 Initialized JPA EntityManagerFactory for persistence unit ‘default’ 他の試行錯誤 コンパイル言語の宿命 Spring Bootに限らずJava等コンパイル言語の宿命ですが、ちょっとした変更でもいちいちコンパイルが必要になりますよね。 そ…

開発時のVueとサーバサイドのポート番号 ポート番号が異なることでの問題点 proxyTableで解決 開発時のVueとサーバサイドのポート番号 VueでサーバサイドのAPIを使用する開発をしており、サーバサイドのサーバも起動させている場合、Vueとサーバサイドのポー…

CORSとは？ CORSの対策 Spring Bootでの対策 方法1 @CrossOriginアノテーション 方法2 Spring SecurityでCORSの設定をする方法 まずはSpring Securityのインストール WebSecurityConfigurerAdapterにCORSの設定 CORSとは？ 通常Webページでは、同一生成元ポ…

Nuxtで使用する$axios getと$getの違い getで取得するパターン $getで取得するパターン POSTも一緒？ Nuxtで使用する$axios SPAサイトではガンガン行う非同期通信、その中でもaxiosは良く使われると思いますが、 Nuxtの場合はnuxt-community/axios-moduleの…

routerでchildrenを設定していると表示されるWARNING 不要なname設定 routerでchildrenを設定していると表示されるWARNING VueやNuxtでは、routerの設定でchildrenを使うと構造的に見やすいルーティングを生成できますよね。 ただし、以下のような一件問題な…

Nuxtのインストール後のディレクトリ構成 不要なら消してしまおう Nuxtのインストール後のディレクトリ構成 yarnやnpmでnuxtをインストールした後のディレクトリ構成は以下になります。Project ┣ .git ┣ .nuxt ┣ node_modules ┣ assets ┣ components ┣ layou…

function()から始まるような構文 モジュールを使って呼び出し Google Tag Managerを使いたい時 Google Fontsを使いたい時 その他の方法 function()から始まるような構文 サイト制作でJavascriptのライブラリを使う昨今、サイト表示時点で外部にアクセスする…

SpringBootのFormで使われるList SpringBootのFormで使われるList SpringBootのFormバリデーションで独自バリデーションを作成し、 適用している人にとってはよく見かけるListですが、これの使い道は知ってますか？例） public @interface List { TestValida…

セッションハイジャックとは セッションIDを使わなければ関係ないの？ ステートレスのサイトでセッションハイジャックを防ぐには セッションハイジャックとは ハイジャックという言葉は、輸送機関などが強奪される時に使用される言葉ですが、web業界でも使用…

Entityの@ManyToOne まずはEntityについて Cascadeはデータベース操作に関連 Entityの@ManyToOne あるEntity（エンティティ）に対してフィールドを設定した時に、 Entityとフィールドが多対一の関係にある時に使用します。 このあたりの説明は長くなるので、…

APIのPOST処理を実行 APIの記述 CORSの設定 CORSの設定を環境ごとに分ける APIのPOST処理を実行 前回は以下の記事のように、RailsでAPIを使用してGET処理を行いました。 ti-tomo-knowledge.hatenablog.com今回はPOST処理の方を行い、データの保存まで行いた…