20210605のMySQLに関する記事は6件です。

【SQL】CASE式について

SQLのCASE式について学んだことをまとめます。 CASE式の概要 CASE式は簡単に言えば「ラベルの読み替え」をやっているに過ぎないのです。 しかし、集約関数などの技術と一緒に使えば以下のことなどが可能です。 ラベルをまとめて読み替え 「行持ち」から「列持ち」への変換 CHECK制約での条件分岐 UPDATE文で条件分岐させて更新 EXISTS述語を利用したクロス表の作成 CASE式の構文 単純CASE式のほうが簡潔に記載できますが、単純CASE式で書けるものは検索CASE式でも書けるため 検索CASE式を使うほうが無難でしょう。 また、ELSE句は必ず書くようにする。 単純CASE式 単純CASE式 CASE sex WHEN 1 THEN '男性' WHEN 2 THEN '女性' ELSE 'その他' END 検索CASE式 検索CASE式 CASE WHEN sex = 1 THEN '男性' WHEN sex = 2 THEN '女性' ELSE 'その他' END CASE式の使用箇所 CASE式は評価すると一つの値になる式のため、以下の箇所のようなどこにでも記載することができます。 SELECT句 WHERE句 GROUP BY句 HAVING句 ORDER BY句 PARTITION BY句 CHECK制約の中 関数の引数 述語の引数 他の式の中(CASE式自身も含む)
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

MySQL,SQL文について

MySQLとは リレーショナルデータベース管理システムの一種のこと。 リレーショナルデータベース管理システム(RDBMS)とは リレーショナルデータベースを管理するためのソフトウェアのこと MySQL以外にもMicrosoft SQL Server,PostgreSQL,SQLiteなどがある。 リレーショナルデータベースとは 世界で最も有名な種類のデータベースで、行と列によって構成された「表形式のテーブル」と呼ばれるデータの集合を、互いに関連付けて関係モデルを使ったデータベースのこと。 いくつかあるデータベースの種類の一つ(他にも階層型、NoSQLなどがあります。) まとめると、データベースという大枠の中に階層型、リレーショナル型、NoSQL、ネットワーク型などがあり、リレーショナル型のデータベースを管理するシステムのことをRDBMS、このRDBMSの一つがMySQL。 SQLとは RDBMSを操作するための言語のこと。 以下のようなことができる。 データの検索 データの追加 データの更新 データの削除 テーブルの作成 テーブルの削除 テーブルの主キーの設定 ユーザー権限の付与 データベース・レコードの作成、削除、更新など データベースの作成 create database first_app_develop; データベースの削除 drop detabase first_app_develop; テーブル・カラムの作成 varchar= variable length(可変長文字列) create table users ( id int, name varchar(10) ); レコードの追加 insert into users (id,name) values (1,'satou'); レコードの更新 update users set name ='佐藤', birthday = '1997-01-01' where id = 1; -- whereは省力可。whereの条件に合致するものは全て書き換わる レコードの削除 delete from users where id = 1; -- update同様に条件に合致するものは全て削除される SELECT文 リレーショナルデータベースのテーブル(表)の行を読み取るためのSQL構文 処理結果はテーブルを返す select 'カラム名' from 'テーブル名'; -- selectやfromは大文字でも小文字でもok select 'カラム名1', 'カラム名2' from 'テーブル名'; -- カラム名は複数指定もできる また、アスタリスクを使用すると全てのカラムを取得できる select * from city ; -- selectは条件に合致した情報を取得し、新しくテーブルを作ってくれる ※MySQLのサイトのworld databaseというデータベースを使って練習したので、これから出てくるテーブル名やカラム名は全てworld databaseにあるものになります。 WHERE句 テーブルデータの検索条件を指定するためのSQL構文 SELECT文やUPDATE文と組み合わせて使う select 'カラム名' from 'テーブル名' where '条件式'; 等価演算 select * from city where Name = 'Tokyo'; -- cityテーブルにあるNameカラムがTokyoとなってるレコードを取得 -- プログラミング言語だとイコール一つは代入になるが、SQLに代入操作がないためイコールは一つ MySQLでは条件に合致しTRUEになると1になり、FALSEは0になる。 select * from city where 1; -- 全てのレコードが得られる select * from city where 0; -- 何も得られない 大小演算子 select * from city where Population >= 1000000; -- 人口1000000人以上の都市を取得 select * from city where Population > 1000000; -- 人口1000000人より大きい都市を取得 select * from city where CoutntryCode > 'Y'; -- 文字列の大小比較の場合辞書順での比較になる -- YよりもあとのCoutryCodeカラムのデータを取得 非等価比較 select * from city where CountryCode != 'JPN'; -- CountryCodeがJPNではないものを取得 AND,BETWEEN,IN -- AND select * from city where CoutntryCode = 'JPN' and Population > 500000; -- BETWEEN select * from city where Population between 400000 and 500000; -- cityテーブルにあるPopulationカラムが400000 ~ 500000の都市を取得 -- IN select * from city where CountryCode in ('FRA','ITA') -- CountryCodeがフランスもしくはイタリアのものを取得 select * from city where CountryCode not in ('FRA','ITA') -- フランスまたはイタリア以外の以外を取得 LIKE句(あいまい検索) ワイルドカード文字 % : 0文字以上のあらゆる文字列 _ : 任意の1文字 %(0文字以上の文字列) select * from city where Name like 'ab%'; -- cityテーブルからNameカラムからabで始まる文字を取得 select * from city where Name like '%ab'; -- cityテーブルからNameカラムのabで終わる都市の名前を取得 select * from city where Name like '%ab%'; -- abを含む都市を検索 _(任意の1文字) 文字数が分かってる場合便利 select * from city where CountryCode like 'JP_'; -- JPの後に続く一文字。 -- アンダースコアが3つの場合 select * from city where Name like '___'; -- Nameカラムが3文字のものを取得 select * from city where Name like '___' and Population > 100000; -- 他の条件式も組み合わせできる ORDER BY ソートできる(デフォルトだと昇順) order by 'カラム名' -- カラム名順に並べ替えることができる select * from city where CountryCode = 'JPN' order by Population; --昇順に並ぶ select * from city where CountryCode = 'JPN' order by Population desc; -- 降順に並ぶ LIMIT句 検索数を制限する select * from city where CountryCode = 'JPN' order by Population desc limit 5; -- cityテーブルにあるCountryCodeがJPNで人口が上位5件のものを降順で取得 OFFSET句 データを取得する開始位置を指定する 例えばOFFSETを4に指定した場合最初から4番目のデータを飛ばし、5番目のデータから取得する select * from user limit 3 offset 4; -- 5番目のユーザーから三人分取得できる 集計関数 平均値,合計値,最大値,最小値などを算出することができる select sum(population) from country; -- coutryテーブルの人口を合計する as句 select文で作成したテーブルに新しくカラム名を決められる select format(sum(population),0) as WorldPoupulation from country; -- format関数で三桁をカンマ区切りにする。 GROUPBY句 select Continent, format(sum(population),0) as ContinentPoupulation from country group by Continent; JOIN テーブルの結合を行い、他のテーブルを横に繋げることができる cityテーブルとcountryテーブルを結合したテーブルを作成 on以降はそれぞれどのカラムが紐づいてるかが書いてある select * from city join country on city.countrycode = country.code; cityテーブルとcountryテーブルをjoinして、日本の人口と東京の人口、日本の人口に対する東京の人口の割合を出してみる select id, city.name, city.population as CityPopulation, country.population as CountryPopulation, city.population / country.population as ratio from city join country on city.countrycode = country.code where city.name = 'Tokyo'; cityテーブルとcountryテーブルどちらにもあるカラムにはどちらのカラムのことかを明示する必要がある
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

macOS XAMPPを用いてWordPressのローカル開発環境をつくる(日本語環境版)

英語環境版を作るにはこちら https://qiita.com/imaicom/items/8f29c4793b6e515a0bd4 目的 レンタルサーバでよく使われている PHP7.4 のローカル開発環境をつくる M1マックで爆速でWordPressを使いたい(これだよ!) 遅いレンタルサーバを使ってネット経由でサイトのデバッグしたくない(切実) 環境構築を優先し、セキュリティは緩く設定する(使い勝手を最優先) XAMPPの最新版を使ってみる(インストールが簡単そう) WordPressの最新版を使う(なんでも最新) 概要 XAMPPのインストール ApacheとMySQLとProFTPDの起動 電源再投入時にXAMPPを起動する phpMyAdminを使ってDB設定 WordPressインストール XAMPPのインストール https://www.apachefriends.org/download.html にて PHP7.4 の最新版をダウンロードする。7.4の最新版の7.4.19 / PHP 7.4.19 Download (64 bit) 161 Mbをクリック。 Downloadフォルダを開き、ダウンロードしたインストーラ「xampp-osx-7.4.19-0-installer.dmg」を開く。 ウインドウが開いたらXAMPPのアイコンをドラックしてアプリケーションフォルダにコピーする。 アプリケーションフォルダを開き、XAMPPのアイコンをクリックして起動 なぜかXAMPP Core Filesがチェックされていないので、チェックする。 アプリケーションフォルダにXAMPPフォルダを別に作りインストールする。 ウェブに誘導される Learn more abort Bitnami for XAMPPのチェックボックスを外す インストールを始める。 圧縮解凍を始める。 途中です。 終わったのでFinishボタンを押す。 ApacheとMySQLとProFTPDの起動 ウェルカム画面出る。旧XAMPPと比べシンプルすぎる。。。これは何かある。。。 Apacheだけ動いていることを確認 プロセス3つとも動かす イベントログを確認する ブラウザを確認する。アクセス先は「localhost」「127.0.0.1」でも大丈夫。 ブラウザ上部のPHPInfoタブを押してみる。 ブラウザ上部のphpMyAdminタブを押してみる。 この位は。。。できて当然だ。。。ここから先が大問題。。。 電源再投入時にXAMPPを起動する HOW-TO-Guidesを見る ページごとグーグル翻訳をかける。一番下の「XAMPPの自動起動」が大事です。 「XAMPPの自動起動 デフォルトでは、システムを再起動するたびに XAMPP またはそのコンポーネントを手動で起動する必要があります。ただし、システムの起動時に XAMPP コンポーネントが自動的に起動するように構成することもできます。」こりゃ面倒なことが書かれている。でも、しょうがない。 ターミナルを起動します。ここからターミナル慣れしてない人は。。。諦めて。。。ください。。。残念。。。 cd /Library/LaunchDaemons sudo vi org.apachefriends.xampp.plist iを入力した後。。。以下をペーストします。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> <plist version="1.0"> <dict> <key>Label</key> <string>org.apachefriends.xampp</string> <key>ProgramArguments</key> <array> <string>/Applications/XAMPP/xamppfiles/xampp</string> <string>start</string> </array> <key>UserName</key> <string>root</string> <key>RunAtLoad</key> <true/> <key>OnDemand</key> <false/> </dict> </plist> ESCキー2回、シフトキー+ZZで保存します。 ls more org.apachefriends.xampp.plist にてちゃんとファイルが作成されていることを確認しましょう。パソコンを再起動します。 ブラウザに「localhost」と入力して動作を確認しましょう。ここで一旦コーヒーブレークしましょうね。疲れたと思います。 phpMyAdminを使ってDB設定 だんだんと難しくなってきました。。。でも、がんばるしかないです。 まずは、ブラウザから「localhost」を入力して、見慣れた画面を出します。右上のphpMyAdminタブを押してみましょう。 この画面は、重要な情報が示されています。データベースとして既に5つ作られていること。文字情報は、UTF-8 Unicode (utf8mb4)が選択されていること。そして、一番大事なこと、データベースの所有者が「root@localhost」であることです。ユーザ名がrootであり、データベースのホストマシンがlocalhostであることを示します。いいですか。これは重要なことです。理解してない人は、ここから先にはすすめません。ブラウザを閉じましょう。 いじくっていると重要な情報をみたくなることがあります。その時は、左上のここを押しましょう。また見られます。ふー。 先に進めます。ユーザアカウントタブを押します。データベースを使えるユーザが並んでいます。今回の場合は、rootという全知全能のユーザを見てみましょう。 ここでも先ほど重要だと言った内容が繰り返されています。データベースを使えるユーザ名はrootであり、ホストマシンが127.0.0.1(localhost)であることを示しています。 Change passwordボタンを押します。パスワードを設定したいときには、設定しましょう。つまり。。。データベースの全知全能のユーザのパスワードは空っぽであることを示しています。パソコンの中にあるデータベースなので、パスワード設定は不要でしょう。セキュリティを上げると使いにくくなるんだよ。空でいいんですよ。今回は。 次に備えて、WordPressで使うデータベースを作っておきましょう。 Databasesタブを押します。WPと入力して、Createボタンを押します。 WPというデータベースが作成されました。テーブルを作ろうという雰囲気になってます。後でWordPressのインストーラが勝手に作るため、空っぽのテーブルのままでよいです。 左上のphpMyAdminを押します。Databasesタブを押します。 WPというデータベースが作成されていることがわかります。 Check privilegesを押します。 ここでも重要な情報が表示されています。確認します。サーバは localhost であること。データベース名は WP であること。データベースのユーザ名は root であることです。これらの情報があとのインストールで必要になってきます。 WordPressインストール XAMPPには、特別に作られたWordPressのインストーラがあるような雰囲気で書かれています。でも、特別なインストーラが見つからないので、ダウンロードしましょう。https://ja.wordpress.org/download/ 現在のバージョンは 5.7.2 でした。 今のmacOSだと、ZIPファイルなので自動的に解凍されています。 wordpressフォルダを確認してます。この後、apacheのデフォルトフォルダに転送します。ProFTPDというFTPサーバが動いています。ただ、FTPを使って転送する苦労はしたくないので、ドラッグアンドドロップで移動します。 アプリケーションフォルダにXAMPPというフォルダがありますので開きます。 apacheのデフォルトフォルダである htdocs フォルダが見えています。htdocsフォルダのアクセス権がキツイので外していきます。xamppfiles フォルダを開きます。 htdocsフォルダを指定したあと、コマンドキーとIを押します。 これだと読めても書き込みすることができないので、書き込む権利を追加します。 鍵マークを押して、パスワード入力します。それから、Writeオプションを入れます。 wordpress フォルダを htdocs フォルダに入れます。 ブラウザから、http://localhost/wordpress/ にアクセスします。「さあ、始めましょう!」ボタンを押します。 さて、あともう少しです。データベース設定で、細かく伝えてきた内容の最終試験ですね。 データベースは既につくりましたので、その名前を入れます。WP です。データベースのユーザ名は root です。パスワードは空っぽ。ホストは localhost 。テーブル作成の頭につく接頭語は wp_ としました。 うまく行ったと思ったでしょ。世の中甘くない。。。またまたエラーです。でも大したことない。読めばわかる。wp-config.php ファイルが作成できないよというエラーです。 htdocsフォルダの中の、WordPressフォルダを開きます。 index.phpを選んで、コマンド+Dキーを押します。 ファイル名を wp-config.php と修正します。 wp-config.phpを開きます。 wp-config.phpの中身を、このように入れ替え保存します。 インストール実行ボタンを押します。 サイトのタイトル、WordPressユーザ名、WordPressパスワード(複雑なパスワードを入れないと先に進めません)、WordPressユーザの電子メールアドレスを入れます。非常に重要な情報なので、画面コピーを取っておきましょう。WordPressをインストール ボタンを押します。 ログイン ボタンを押します。 先ほど入力したWordPressユーザ名、WordPressパスワードを入力します。ログイン状態を保存する チェックボックスを入れておくと便利です。 ようやく使い慣れたWordPressがローカル環境で動き始めました。コーヒーブレークしましょうね。とてもじゃないが。。。大変でしょう。このドキュメントなしで作れますか? サーバのことが完全に理解できていないと作れません。 今回作ったローカル環境のWordPressへのアクセス先は、次のとおりです。ブラウザ閉じてもご安心ください。 http://localhost/wordpress/wp-admin/ 追記 これをダブルクリックすると、 このXAMPPの設定画面が出ます。今でもよくわからないことの1つ。データベースの停止ができません。この状態でデータベースは実は止まってません。原因は今のところ不明です。 翻訳エラーへの対応 これはなんだと思いますか? かなり難解なエラーメッセージです。どうしようもないからFTPサーバから取ってきたら直るかもっていうメッセージです。このエラーメッセージ対応のFTPサーバなんて無いんです。実にいい加減だ。 これも難物です。かなりややこしいので。。。メモだけにさせてください。WordPress面倒すぎる。改めて大嫌いになった。仕事じゃなければ付き合いたくない。 wordpress フォルダの wp-config.php のどこでもいいので、次の行を入れて保存してください。 define('FS_METHOD', 'direct'); 次に WordPress フォルダ内の wp-content フォルダのパーミッションを中身を含め全部書き込み可能に更新する必要があります。 「翻訳を更新」ボタンを押します。 これでエラーを全部無くしました。WordPressエラーありすぎ。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

macOS XAMPPを用いてWordPressのローカル開発環境をつくる(英語環境版)

日本語環境版を作るにはこちら https://qiita.com/imaicom/items/f4b2a6e1b6a636b56542 目的 レンタルサーバでよく使われている PHP7.4 のローカル開発環境をつくる M1マックで爆速でWordPressを使いたい(これだよ!) 遅いレンタルサーバを使ってネット経由でサイトのデバッグしたくない(切実) 環境構築を優先し、セキュリティは緩く設定する(使い勝手を最優先) XAMPPの最新版を使ってみる(インストールが簡単そう) WordPressの最新版を使う(なんでも最新) 概要 XAMPPのインストール ApacheとMySQLとProFTPDの起動 電源再投入時にXAMPPを起動する phpMyAdminを使ってDB設定 WordPressインストール XAMPPのインストール https://www.apachefriends.org/download.html にて PHP7.4 の最新版をダウンロードする。7.4の最新版の7.4.19 / PHP 7.4.19 Download (64 bit) 161 Mbをクリック。 Downloadフォルダを開き、ダウンロードしたインストーラ「xampp-osx-7.4.19-0-installer.dmg」を開く。 ウインドウが開いたらXAMPPのアイコンをドラックしてアプリケーションフォルダにコピーする。 アプリケーションフォルダを開き、XAMPPのアイコンをクリックして起動 なぜかXAMPP Core Filesがチェックされていないので、チェックする。 アプリケーションフォルダにXAMPPフォルダを別に作りインストールする。 ウェブに誘導される Learn more abort Bitnami for XAMPPのチェックボックスを外す インストールを始める。 圧縮解凍を始める。 途中です。 終わったのでFinishボタンを押す。 ApacheとMySQLとProFTPDの起動 ウェルカム画面出る。旧XAMPPと比べシンプルすぎる。。。これは何かある。。。 Apacheだけ動いていることを確認 プロセス3つとも動かす イベントログを確認する ブラウザを確認する。アクセス先は「localhost」「127.0.0.1」でも大丈夫。 ブラウザ上部のPHPInfoタブを押してみる。 ブラウザ上部のphpMyAdminタブを押してみる。 この位は。。。できて当然だ。。。ここから先が大問題。。。 電源再投入時にXAMPPを起動する HOW-TO-Guidesを見る ページごとグーグル翻訳をかける。一番下の「XAMPPの自動起動」が大事です。 「XAMPPの自動起動 デフォルトでは、システムを再起動するたびに XAMPP またはそのコンポーネントを手動で起動する必要があります。ただし、システムの起動時に XAMPP コンポーネントが自動的に起動するように構成することもできます。」こりゃ面倒なことが書かれている。でも、しょうがない。 ターミナルを起動します。ここからターミナル慣れしてない人は。。。諦めて。。。ください。。。残念。。。 cd /Library/LaunchDaemons sudo vi org.apachefriends.xampp.plist iを入力した後。。。以下をペーストします。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> <plist version="1.0"> <dict> <key>Label</key> <string>org.apachefriends.xampp</string> <key>ProgramArguments</key> <array> <string>/Applications/XAMPP/xamppfiles/xampp</string> <string>start</string> </array> <key>UserName</key> <string>root</string> <key>RunAtLoad</key> <true/> <key>OnDemand</key> <false/> </dict> </plist> ESCキー2回、シフトキー+ZZで保存します。 ls more org.apachefriends.xampp.plist にてちゃんとファイルが作成されていることを確認しましょう。パソコンを再起動します。 ブラウザに「localhost」と入力して動作を確認しましょう。ここで一旦コーヒーブレークしましょうね。疲れたと思います。 phpMyAdminを使ってDB設定 だんだんと難しくなってきました。。。でも、がんばるしかないです。 まずは、ブラウザから「localhost」を入力して、見慣れた画面を出します。右上のphpMyAdminタブを押してみましょう。 この画面は、重要な情報が示されています。データベースとして既に5つ作られていること。文字情報は、UTF-8 Unicode (utf8mb4)が選択されていること。そして、一番大事なこと、データベースの所有者が「root@localhost」であることです。ユーザ名がrootであり、データベースのホストマシンがlocalhostであることを示します。いいですか。これは重要なことです。理解してない人は、ここから先にはすすめません。ブラウザを閉じましょう。 いじくっていると重要な情報をみたくなることがあります。その時は、左上のここを押しましょう。また見られます。ふー。 先に進めます。ユーザアカウントタブを押します。データベースを使えるユーザが並んでいます。今回の場合は、rootという全知全能のユーザを見てみましょう。 ここでも先ほど重要だと言った内容が繰り返されています。データベースを使えるユーザ名はrootであり、ホストマシンが127.0.0.1(localhost)であることを示しています。 Change passwordボタンを押します。パスワードを設定したいときには、設定しましょう。つまり。。。データベースの全知全能のユーザのパスワードは空っぽであることを示しています。パソコンの中にあるデータベースなので、パスワード設定は不要でしょう。セキュリティを上げると使いにくくなるんだよ。空でいいんですよ。今回は。 次に備えて、WordPressで使うデータベースを作っておきましょう。 Databasesタブを押します。WPと入力して、Createボタンを押します。 WPというデータベースが作成されました。テーブルを作ろうという雰囲気になってます。後でWordPressのインストーラが勝手に作るため、空っぽのテーブルのままでよいです。 左上のphpMyAdminを押します。Databasesタブを押します。 WPというデータベースが作成されていることがわかります。 Check privilegesを押します。 ここでも重要な情報が表示されています。確認します。サーバは localhost であること。データベース名は WP であること。データベースのユーザ名は root であることです。これらの情報があとのインストールで必要になってきます。 WordPressインストール XAMPPには、特別に作られたWordPressのインストーラがあるような雰囲気で書かれています。でも、特別なインストーラが見つからないので、ダウンロードしましょう。https://wordpress.org/download/ 現在のバージョンは 5.7.2 でした。 今のmacOSだと、ZIPファイルなので自動的に解凍されています。 wordpressフォルダを確認してます。この後、apacheのデフォルトフォルダに転送します。ProFTPDというFTPサーバが動いています。ただ、FTPを使って転送する苦労はしたくないので、ドラッグアンドドロップで移動します。 アプリケーションフォルダにXAMPPというフォルダがありますので開きます。 apacheのデフォルトフォルダである htdocs フォルダが見えています。htdocsフォルダのアクセス権がキツイので外していきます。xamppfiles フォルダを開きます。 htdocsフォルダを指定したあと、コマンドキーとIを押します。 これだと読めても書き込みすることができないので、書き込む権利を追加します。 鍵マークを押して、パスワード入力します。それから、Writeオプションを入れます。 wordpress フォルダを htdocs フォルダに入れます。 ブラウザから、http://localhost/wordpress/ にアクセスします。Let's go!ボタンを押します。 さて、あともう少しです。データベース設定で、細かく伝えてきた内容の最終試験ですね。 データベースは既につくりましたので、その名前を入れます。WP です。データベースのユーザ名は root です。パスワードは空っぽ。ホストは localhost 。テーブル作成の頭につく接頭語は wp_ としました。 うまく行ったと思ったでしょ。世の中甘くない。。。またまたエラーです。でも大したことない。読めばわかる。wp-config.php ファイルが作成できないよというエラーです。 htdocsフォルダの中の、WordPressフォルダを開きます。 index.phpを選んで、コマンド+Dキーを押します。 ファイル名を wp-config.php と修正します。 wp-config.phpを開きます。 wp-config.phpの中身を、このように入れ替え保存します。 Run the installationボタンを押します。 サイトのタイトル、WordPressユーザ名、WordPressパスワード(複雑なパスワードを入れないと先に進めません)、WordPressユーザの電子メールアドレスを入れます。非常に重要な情報なので、画面コピーを取っておきましょう。Install WordPress ボタンを押します。 Log in ボタンを押します。 先ほど入力したWordPressユーザ名、WordPressパスワードを入力します。Remember Meチェックボックスを入れておくと便利です。 ようやく使い慣れたWordPressがローカル環境で動き始めました。コーヒーブレークしましょうね。とてもじゃないが。。。大変でしょう。このドキュメントなしで作れますか? サーバのことが完全に理解できていないと作れません。 今回作ったローカル環境のWordPressへのアクセス先は、次のとおりです。ブラウザ閉じてもご安心ください。 http://localhost/wordpress/wp-admin/ 追記 これをダブルクリックすると、 このXAMPPの設定画面が出ます。今でもよくわからないことの1つ。データベースの停止ができません。この状態でデータベースは実は止まってません。原因は今のところ不明です。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

macOS XAMPPを用いてWordPressのローカル開発環境をつくる

目的 レンタルサーバでよく使われている PHP7.4 のローカル開発環境をつくる M1マックで爆速でWordPressを使いたい(これだよ!) 遅いレンタルサーバを使ってネット経由でサイトのデバッグしたくない(切実) 環境構築を優先し、セキュリティは緩く設定する(使い勝手を最優先) XAMPPの最新版を使ってみる(インストールが簡単そう) WordPressの最新版を使う(なんでも最新) 概要 XAMPPのインストール ApacheとMySQLとProFTPDの起動 電源再投入時にXAMPPを起動する phpMyAdminを使ってDB設定 WordPressインストール XAMPPのインストール https://www.apachefriends.org/download.html にて PHP7.4 の最新版をダウンロードする。7.4の最新版の7.4.19 / PHP 7.4.19 Download (64 bit) 161 Mbをクリック。 Downloadフォルダを開き、ダウンロードしたインストーラ「xampp-osx-7.4.19-0-installer.dmg」を開く。 ウインドウが開いたらXAMPPのアイコンをドラックしてアプリケーションフォルダにコピーする。 アプリケーションフォルダを開き、XAMPPのアイコンをクリックして起動 なぜかXAMPP Core Filesがチェックされていないので、チェックする。 アプリケーションフォルダにXAMPPフォルダを別に作りインストールする。 ウェブに誘導される Learn more abort Bitnami for XAMPPのチェックボックスを外す インストールを始める。 圧縮解凍を始める。 途中です。 終わったのでFinishボタンを押す。 ApacheとMySQLとProFTPDの起動 ウェルカム画面出る。旧XAMPPと比べシンプルすぎる。。。これは何かある。。。 Apacheだけ動いていることを確認 プロセス3つとも動かす イベントログを確認する ブラウザを確認する。アクセス先は「localhost」「127.0.0.1」でも大丈夫。 ブラウザ上部のPHPInfoタブを押してみる。 ブラウザ上部のphpMyAdminタブを押してみる。 この位は。。。できて当然だ。。。ここから先が大問題。。。 電源再投入時にXAMPPを起動する HOW-TO-Guidesを見る ページごとグーグル翻訳をかける。一番下の「XAMPPの自動起動」が大事です。 「XAMPPの自動起動 デフォルトでは、システムを再起動するたびに XAMPP またはそのコンポーネントを手動で起動する必要があります。ただし、システムの起動時に XAMPP コンポーネントが自動的に起動するように構成することもできます。」こりゃ面倒なことが書かれている。でも、しょうがない。 ターミナルを起動します。ここからターミナル慣れしてない人は。。。諦めて。。。ください。。。残念。。。 cd /Library/LaunchDaemons sudo vi org.apachefriends.xampp.plist iを入力した後。。。以下をペーストします。 <?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> <plist version="1.0"> <dict> <key>Label</key> <string>org.apachefriends.xampp</string> <key>ProgramArguments</key> <array> <string>/Applications/XAMPP/xamppfiles/xampp</string> <string>start</string> </array> <key>UserName</key> <string>root</string> <key>RunAtLoad</key> <true/> <key>OnDemand</key> <false/> </dict> </plist> ESCキー2回、シフトキー+ZZで保存します。 ls more org.apachefriends.xampp.plist にてちゃんとファイルが作成されていることを確認しましょう。パソコンを再起動します。 ブラウザに「localhost」と入力して動作を確認しましょう。ここで一旦コーヒーブレークしましょうね。疲れたと思います。 phpMyAdminを使ってDB設定 だんだんと難しくなってきました。。。でも、がんばるしかないです。 まずは、ブラウザから「localhost」を入力して、見慣れた画面を出します。右上のphpMyAdminタブを押してみましょう。 この画面は、重要な情報が示されています。データベースとして既に5つ作られていること。文字情報は、UTF-8 Unicode (utf8mb4)が選択されていること。そして、一番大事なこと、データベースの所有者が「root@localhost」であることです。ユーザ名がrootであり、データベースのホストマシンがlocalhostであることを示します。いいですか。これは重要なことです。理解してない人は、ここから先にはすすめません。ブラウザを閉じましょう。 いじくっていると重要な情報をみたくなることがあります。その時は、左上のここを押しましょう。また見られます。ふー。 先に進めます。ユーザアカウントタブを押します。データベースを使えるユーザが並んでいます。今回の場合は、rootという全知全能のユーザを見てみましょう。 ここでも先ほど重要だと言った内容が繰り返されています。データベースを使えるユーザ名はrootであり、ホストマシンが127.0.0.1(localhost)であることを示しています。 Change passwordボタンを押します。パスワードを設定したいときには、設定しましょう。つまり。。。データベースの全知全能のユーザのパスワードは空っぽであることを示しています。パソコンの中にあるデータベースなので、パスワード設定は不要でしょう。セキュリティを上げると使いにくくなるんだよ。空でいいんですよ。今回は。 次に備えて、WordPressで使うデータベースを作っておきましょう。 Databasesタブを押します。WPと入力して、Createボタンを押します。 WPというデータベースが作成されました。テーブルを作ろうという雰囲気になってます。後でWordPressのインストーラが勝手に作るため、空っぽのテーブルのままでよいです。 左上のphpMyAdminを押します。Databasesタブを押します。 WPというデータベースが作成されていることがわかります。 Check privilegesを押します。 ここでも重要な情報が表示されています。確認します。サーバは localhost であること。データベース名は WP であること。データベースのユーザ名は root であることです。これらの情報があとのインストールで必要になってきます。 WordPressインストール XAMPPには、特別に作られたWordPressのインストーラがあるような雰囲気で書かれています。でも、特別なインストーラが見つからないので、ダウンロードしましょう。https://wordpress.org/download/ 現在のバージョンは 5.7.2 でした。 今のmacOSだと、ZIPファイルなので自動的に解凍されています。 wordpressフォルダを確認してます。この後、apacheのデフォルトフォルダに転送します。ProFTPDというFTPサーバが動いています。ただ、FTPを使って転送する苦労はしたくないので、ドラッグアンドドロップで移動します。 アプリケーションフォルダにXAMPPというフォルダがありますので開きます。 apacheのデフォルトフォルダである htdocs フォルダが見えています。htdocsフォルダのアクセス権がキツイので外していきます。xamppfiles フォルダを開きます。 htdocsフォルダを指定したあと、コマンドキーとIを押します。 これだと読めても書き込みすることができないので、書き込む権利を追加します。 鍵マークを押して、パスワード入力します。それから、Writeオプションを入れます。 wordpress フォルダを htdocs フォルダに入れます。 ブラウザから、http://localhost/wordpress/ にアクセスします。Let's go!ボタンを押します。 さて、あともう少しです。データベース設定で、細かく伝えてきた内容の最終試験ですね。 データベースは既につくりましたので、その名前を入れます。wp です。データベースのユーザ名は root です。パスワードは空っぽ。ホストは localhost 。テーブル作成の頭につく接頭語は wp_ としました。 うまく行ったと思ったでしょ。世の中甘くない。。。またまたエラーです。でも大したことない。読めばわかる。wp-config.php ファイルが作成できないよというエラーです。 htdocsフォルダの中の、WordPressフォルダを開きます。 index.phpを選んで、コマンド+Dキーを押します。 ファイル名を wp-config.php と修正します。 wp-config.phpを開きます。 <?php /** * The base configuration for WordPress * * The wp-config.php creation script uses this file during the * installation. You don't have to use the web site, you can * copy this file to "wp-config.php" and fill in the values. * * This file contains the following configurations: * * * MySQL settings * * Secret keys * * Database table prefix * * ABSPATH * * @link https://wordpress.org/support/article/editing-wp-config-php/ * * @package WordPress */ // ** MySQL settings - You can get this info from your web host ** // /** The name of the database for WordPress */ define( 'DB_NAME', 'wp' ); /** MySQL database username */ define( 'DB_USER', 'root' ); /** MySQL database password */ define( 'DB_PASSWORD', '' ); /** MySQL hostname */ define( 'DB_HOST', 'localhost' ); /** Database Charset to use in creating database tables. */ define( 'DB_CHARSET', 'utf8mb4' ); /** The Database Collate type. Don't change this if in doubt. */ define( 'DB_COLLATE', '' ); /**#@+ * Authentication Unique Keys and Salts. * * Change these to different unique phrases! * You can generate these using the {@link https://api.wordpress.org/secret-key/1.1/salt/ WordPress.org secret-key service} * You can change these at any point in time to invalidate all existing cookies. This will force all users to have to log in again. * * @since 2.6.0 */ define( 'AUTH_KEY', 'iGn9&;Vw]#<ajh[.}o?4.<g5|_Z{$WvGh,2Kw8sqeMoP3jIec^{vR@Y(+GT8vV-/' ); define( 'SECURE_AUTH_KEY', 'lwy5%afV$H6[}c{?,1DANpTJ7r/ap<6L(9-<$+*CX<HK5U`mT~-R]wzPQ!+G-<iY' ); define( 'LOGGED_IN_KEY', 'Ff?(TQ;Rq7q:i!1B&+oHM]5q_GTgx{,pQDb;j)}{MRz]@CwWzLLEN}DJpVh]-fGT' ); define( 'NONCE_KEY', 'Flv$P^c, .o[!ZAXk?3VR&gYPa!Cqu]!&Q;<IH@aB$=bvy4>k%^Kp_VJJGj1O&Gg' ); define( 'AUTH_SALT', 'p=Q#|vCOKR TqOqM]U.t|DAuF.vz;wjZDZJYS<Z#^XHL(u]bHI@}T:vuBKaZtz' ); define( 'SECURE_AUTH_SALT', '{.#zd03Z2dR[J=Na*LEN</zIkJa3.10R2n%`~ZArCv*8<CUU9+]O*k+p$]lqeI{1' ); define( 'LOGGED_IN_SALT', '9!2aLj-XZhjq}PKR$|*E?)1&>cgiS~;{.9phnmLlDtql}/a}`lSb(Z)f$LmI<_!v' ); define( 'NONCE_SALT', 'I@C>}7y]j!!rqZqT2AX^JM()C9`gl+`S]^:b<zR>hZ[4}ajAP<~Nu:3A;MCzi*G ' ); /**#@-*/ /** * WordPress Database Table prefix. * * You can have multiple installations in one database if you give each * a unique prefix. Only numbers, letters, and underscores please! */ $table_prefix = 'wp_'; /** * For developers: WordPress debugging mode. * * Change this to true to enable the display of notices during development. * It is strongly recommended that plugin and theme developers use WP_DEBUG * in their development environments. * * For information on other constants that can be used for debugging, * visit the documentation. * * @link https://wordpress.org/support/article/debugging-in-wordpress/ */ define( 'WP_DEBUG', false ); /* That's all, stop editing! Happy publishing. */ /** Absolute path to the WordPress directory. */ if ( ! defined( 'ABSPATH' ) ) { define( 'ABSPATH', __DIR__ . '/' ); } /** Sets up WordPress vars and included files. */ require_once ABSPATH . 'wp-settings.php'; wp-config.phpの中身を、このように入れ替え保存します。 Run the installationボタンを押します。 サイトのタイトル、WordPressユーザ名、WordPressパスワード(複雑なパスワードを入れないと先に進めません)、WordPressユーザの電子メールアドレスを入れます。非常に重要な情報なので、画面コピーを取っておきましょう。Install WordPress ボタンを押します。 Log in ボタンを押します。 先ほど入力したWordPressユーザ名、WordPressパスワードを入力します。Remember Meチェックボックスを入れておくと便利です。 ようやく使い慣れたWordPressがローカル環境で動き始めました。コーヒーブレークしましょうね。とてもじゃないが。。。大変でしょう。このドキュメントなしで作れますか? サーバのことが完全に理解できていないと作れません。 今回作ったローカル環境のWordPressへのアクセス先は、次のとおりです。ブラウザ閉じてもご安心ください。 http://localhost/wordpress/wp-admin/ 追記 これをダブルクリックすると、 このXAMPPの設定画面が出ます。今でもよくわからないことの1つ。データベースの停止ができません。この状態でデータベースは実は止まってません。原因は今のところ不明です。
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む

プロジェクト型演習 #3 (DB作成, web画面)

本番環境の構築 実際にシステムで使用するDBを作成する。 前提として プロジェクト型演習 #1 (raspberrypi DB操作) 実装済み、更に Apache2 をインストール済みののRaspberry Pi を利用しているものとして話を進める。 今回は、本番用DBを作成し、Web画面で確認するところまでやってみる。 DB構築 ログイン 面倒なので、以前作成したユーザ, DBを使い回す。 ユーザでログイン pi@raspberry:~ $ sudo mysql -upi -praspberry DBへ入る MariaDB[(none)]> use sample_db Database changed 各種テーブルの作成 ※下記SQL文をそのままコピペでおけ。詳しくは #1 を参照。 スコアテーブルの作成 CREATE TABLE `score` ( `num` int(32) NOT NULL AUTO_INCREMENT, `id` int(4) NOT NULL, `score` int(8) NOT NULL, `great` int(4) NOT NULL, `good` int(4) NOT NULL, `bad` int(4) NOT NULL, `datetime` DATETIME NOT NULL, PRIMARY KEY (`num`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8; 楽曲テーブルの作成 CREATE TABLE `music` ( `id` int(4) NOT NULL AUTO_INCREMENT, `name` varchar(512) NOT NULL, `max` int(8) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8; 楽曲テーブルにデータを挿入 INSERT INTO `music` (`name`, `max`) VALUES ("ピタゴラスイッチ", 1000), ("きらきら星", 1000); スコアテーブルにデータを挿入 INSERT INTO `score` (`id`, `score`, `great`, `good`, `bad`, `datetime`) VALUES (1, 305, 25, 51, 24, '2021-06-01 21:45:31'), (1, 700, 50, 40, 10, '2021-06-02 21:45:31'), (2, 625, 40, 45, 15, '2021-06-03 21:45:31'), (1, 125, 5, 15, 80, '2021-06-03 21:45:31'); WEB画面 (PHP) TOPページ 今後修正予定だが、雑に作っておく。 以下の全ファイルを/var/www/html/内に配置。index.phpは前回作成したものを修正する。 pi@raspberry:~ $ cd /var/www/html pi@raspberry:/var/www/html $ nano index.php TOP index.php <?php $title = "認知症予防システム"; require('./header.php'); $page = "home"; ?> <h1 class="mx-auto" style="width: 200px; font-family: ヒラギノ丸ゴ ProN W4;">スコア表</h1> <table class="table"> <thead class="table-light" style="background-color: #008b8b;"> <th>日付</th> <th>曲名</th> <th>スコア</th> <th>GREAT</th> <th>GOOD</th> <th>BAD</th> <th>%</th> </thead> <?php ini_set('display_errors', "On"); //phpinfo(); include "./pdo_connect.php"; $sql = "SELECT * FROM score JOIN music WHERE score.id = music.id ORDER BY score.datetime DESC"; $stmt = $pdo -> query($sql); foreach($stmt as $row){ ?> <tbody id = "<?=$row['num']?>"> <td><?=date('Y年m月d日 H:i',strtotime($row['datetime']))?></td> <td><?=$row['name']?></td> <td><?=$row['score']?></td> <td><?=$row['great']?></td> <td><?=$row['good']?></td> <td><?=$row['bad']?></td> <td><?=($row['score'] / $row['max']) * 100?></td> </tbody> <?php } ?> </table> <?php require('./footer.php'); ?> ヘッダーファイル pi@raspberry:/var/www/html $ nano header.php ヘッダーファイル header.php <!DOCTYPE html> <html lang='ja'> <head> <meta charset='utf-8' /> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script> <title><?=$title?></title> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.0/main.min.css"> <script src="https://cdn.jsdelivr.net/npm/fullcalendar@5.5.0/main.min.js"></script> </head> <body> <nav class="navbar navbar-dark mb-5" style="background-color: #008080;"> <a class="navbar-brand" href="./index.php">認知症予防システム</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNavAltMarkup"> <div class="navbar-nav"> <a id="home" class="nav-item nav-link" href="./index.php">Home <span class="sr-only">(current)</span></a> <a id="calendar" class="nav-item nav-link" href="./calendar.php">Calendar</a> <a id="graph" class="nav-item nav-link" href="./graph.php">Graph</a> </div> </div> </nav> <div class="container w-80"> フッターファイル pi@raspberry:/var/www/html $ nano footer.php フッターファイル footer.php </div> </body> </html> <script> const div = document.getElementById("<?=$page?>"); div.classList.add('active'); </script> カレンダー pi@raspberry:/var/www/html $ nano calendar.php カレンダー calendar.php <?php $title = "カレンダー"; require('./header.php'); $page = "calendar"; ?> <div id='calendar-box'></div> <?php require('./footer.php'); ?> <script> document.addEventListener('DOMContentLoaded', function() { var calendarEl = document.getElementById('calendar-box'); var calendar = new FullCalendar.Calendar(calendarEl, { initialView: 'dayGridMonth', events: [ <?php include "./pdo_connect.php"; $sql = "SELECT * FROM score JOIN music WHERE score.id = music.id"; $stmt = $pdo -> query($sql); foreach($stmt as $row){ ?> { id: '<?=$row['num']?>', title: '<?=$row['name']." ".$row['score']?>', start: '<?=date('Y-m-d',strtotime($row['datetime']))?>', url: './index.php#<?=$row['num']?>' }, <?php } ?> ], // 日本語化 locale: 'ja', buttonText: { prev: '<', next: '>', prevYear: '<<', nextYear: '>>', today: '今日', month: '月', week: '週', day: '日', list: '一覧' }, }); calendar.render(); }); </script> グラフ pi@raspberry:/var/www/html $ nano graph.php グラフ graph.php <?php $title = "グラフ"; require('./header.php'); $page = "graph"; $labels = []; $datetime_list = []; for ($i = 6; $i >= 0; $i--) { $m = (int)date("m", strtotime("-"."$i"." day")); $d = (int)date("d", strtotime("-"."$i"." day")); $labels[] = $m."月".$d."日"; $datetime_list[] = date("Y-m-d", strtotime("-"."$i"." day")); } $start = date("Y-m-d", strtotime("-6 day")); $start .= " 00:00:00"; $end = date("Y-m-d", strtotime("-0 day")); $end .= " 99:99:99"; include "./pdo_connect.php"; $sql = "SELECT * FROM score JOIN music WHERE score.id = music.id AND score.datetime BETWEEN '$start' AND '$end' ORDER BY score.datetime ASC"; $stmt = $pdo -> query($sql); $cnt = 0; $max_list = [0, 0, 0, 0, 0, 0, 0]; $min_list = [200, 200, 200, 200, 200, 200, 200]; foreach($stmt as $row){ for ($i = $cnt; $i < 7; $i++) { if ($datetime_list[$i]." 00:00:00" <= $row['datetime'] && $row['datetime'] <= $datetime_list[$i]." 99:99:99") { if ($max_list[$cnt] < ($row['score'] / $row['max']) * 100) { $max_list[$cnt] = ($row['score'] / $row['max']) * 100; } if ($min_list[$cnt] > ($row['score'] / $row['max']) * 100) { $min_list[$cnt] = ($row['score'] / $row['max']) * 100; } break; } else { $cnt ++; } } } for ($i = 0; $i < 7; $i++) { if ($min_list[$i] == 200) { $min_list[$i] = 0; } } ?> <h1>折れ線グラフ</h1> <canvas id="myLineChart"></canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.bundle.js"></script> <script> var ctx = document.getElementById("myLineChart"); var myLineChart = new Chart(ctx, { type: 'line', data: { labels: ['<?=$labels[0]?>', '<?=$labels[1]?>', '<?=$labels[2]?>', '<?=$labels[3]?>', '<?=$labels[4]?>', '<?=$labels[5]?>', '<?=$labels[6]?>'], datasets: [ { label: '最高得点率(%)', data: [<?=$max_list[0]?>, <?=$max_list[1]?>, <?=$max_list[2]?>, <?=$max_list[3]?>, <?=$max_list[4]?>, <?=$max_list[5]?>, <?=$max_list[6]?>], borderColor: "rgba(255,0,0,1)", backgroundColor: "rgba(0,0,0,0)" }, { label: '最低得点率(%)', data: [<?=$min_list[0]?>, <?=$min_list[1]?>, <?=$min_list[2]?>, <?=$min_list[3]?>, <?=$min_list[4]?>, <?=$min_list[5]?>, <?=$min_list[6]?>], borderColor: "rgba(0,0,255,1)", backgroundColor: "rgba(0,0,0,0)" } ], }, options: { title: { display: true, text: '得点率(<?=$labels[0]?> ~ <?=$labels[6]?>)' }, scales: { yAxes: [{ ticks: { suggestedMax: 100, suggestedMin: 0, stepSize: 10, callback: function(value, index, values){ return value + '%' } } }] }, } }); </script> <?php require('./footer.php'); ?> DB接続ファイル pi@raspberry:/var/www/html $ nano pdo_connect.php DB接続ファイル pdo_connect.php <?php //データベースの接続と選択 $hostdbname = 'mysql:host=localhost;dbname=sample_db;charset=UTF8'; $username = "pi"; $password = "raspberry"; $pdo = new PDO($hostdbname, $username, $password); $pdo -> setAttribute(PDO::ATTR_ERRMODE,PDO::ERRMODE_EXCEPTION); ?> 実行 TOPページの確認 カレンダーページの確認 グラフページの確認 おそらくこんな感じでできるはず、、、 ※この画像はPC上にDockerで環境構築したものを使用している為、実際とは異なる。 今後 TOPページの装飾 検索機能やランキング、ソートなんかの実装(余力あれば)
  • このエントリーをはてなブックマークに追加
  • Qiitaで続きを読む