ブログのアクセスが1日で30倍になった要因を分析してみた
こんにちは！IT女子のちーさんです。
実は、先日投稿した「どんなときもWiFi」の記事がちょっとバズりました。
このブログの普段のアクセスは、大体1日100~300くらいなのですが、2019年5月12日だけ「9,214PV」を達成しました。
これ、個人的にはすごい数字です。一時的とは言え、とても嬉しかったです！
ということで、せっかくなので、この日一体何が起こったのか、説明し、次に活かすための分析をしてみたいと思います。
Googleアナリティクスをみてみよう
Googleアナリティクスはこんな感じでした。
圧倒的に新規ユーザーが増えていますね。11日ごろから徐々に増え始め、12日にピークを迎えて最高アクセス数「9,214PV」を達成しました。直前のアクセス数は300くらいだったので、30倍です。13日からは徐々に下がっていき、現在は元のアクセス数に戻っています。
一番アクセスが伸びた12日の時間別推移はこちら。
15時以降に伸びて、19時過ぎたあたりから急激に伸びました。
私が異変に気づいたのは、12日の21時ごろです。なんか妙にはてなブログに知らない人からのコメントが寄せられてるなと。そこで、はてなブログのアクセスを調べると大変なことになっていました。じゃあ、このアクセスは一体どこから来ているのでしょうか？
流入元をチェックしてみましょう。
ほとんどがdirectとなっており、流入元が取れていないのですが、2番目に「googleapis.com」と書いてあります。
googleapis.comとは
googleapis.comについて調べたところ、GoogleChromeアプリのトップに表示されるおすすめ記事だということが判明しました。
実際に見にいってみたら...
ありました！感動！
興奮のあまりそのままツイートし、Facebookにも投稿しちゃいました。
今まで1日100~200前後のアクセスだったブログが今日6000アクセス以上になってて、要因調べたら昨日の #どんなときもwifi の記事が Google Chromeアプリのおすすめ記事に入ってた…！
— ちーさん♨️web系銭湯女子 (@igaiga115) May 12, 2019
こんなの初めて‼️ビックリ😂
コツコツ続けてきてよかった〜！
#ろりラジ pic.twitter.com/eo6COYynHI
普段ブログを見てくれている人からたくさんのいいねやコメントをいただきました。ありがとうございます！
なぜGoogleChomeアプリに取り上げられたのか？
ここから要因分析に入っていきたいと思います。
とは言え、少し調べた感じ、GoogleChomeに取り上げられる要素のようなものは明確には公開されていないようなので、想像するしかありません。
記事の内容やその時の状況を振り返り、要因を想定してみようと思います。
どんなときもWiFiが新しいサービスだったから
一番大きな要因はこれだと思うのですが、どんなときもWiFiは、先月からスタートした新しいサービスなので、まだまだレビューを書いてる人が少なかったと思います。その中で私が詳しめにレビューしたので、他の記事よりも優れているレビュー記事として評価されておすすめに載ったのだと思われます。
Twitterでシェアされた
Voicyのろりラジなどで、事前予告していた甲斐もあり、結構リツイートされたり、リプをたくさんもらったりしました。
話題の #どんなときもwifi についてレビューしました！これめっちゃいいです！WiFi乞食から卒業してストレス減った♪#ろりラジ #はてなブログ
— ちーさん♨️web系銭湯女子 (@igaiga115) May 11, 2019
「どんなときもWiFi」を契約してWiFi乞食から卒業できました - IT女子ち…https://t.co/Dvo0GEAKJc
こちらの記事もオススメ
めちゃくちゃわかりやすいから
— しんたろーたりー🎙(営業力✖︎ナンパ力)➕ラジオ (@ryuka121212) May 11, 2019
WiMAXで ３日で10GB制限に迷ってる人は絶対よんでほしい
通信量無制限のモバイルWiFi「どんなときもWiFi」を契約してWiFi乞食から卒業できました - IT女子ちーさんのwebろぐ https://t.co/fayrfYEFeW
フォロワー数の多い方にもシェアしていただきました。
通信量無制限のモバイルWiFi「どんなときもWiFi」を契約してWiFi乞食から卒業できました - IT女子ちーさんのwebろぐ https://t.co/ggthhtISkC
— 【嘘つきニート】あれっくす💰💰💰返信非表示推奨 (@alex100NetB) May 12, 2019
その結果、Twitterでの露出も増え、記事の評価につながったと考えられます。
ビジュアルを頑張った
どんなときもWiFiの記事を書いた前の週に、はてなブログを少しカスタマイズしてビジュアルを良くしました。
具体的にはこんな感じのことをしました。
これらは、はてなブログのCSSをいじって他のサイトからデザインを拝借して実装しました。これでだいぶ記事が見やすくなったと思います。
また、複雑な「WiMAXとの違い」という点については、Keynoteで図を作りました。
メリットとデメリット両方書いた
これはおそらくSEOで評価されるためにも重要なことですが、メリットとデメリットを両方書くということです。基本的にはおすすめですが、注意点もあるよという書き方をしました。これにより、信頼性のある記事として評価されたのだと思います。また、デメリットがある上で、こんな人にだったらおすすめできるという点を記載したのもよかったと思っています。
オリジナル要素が多かった
実際に自分で使ってみての感想なので、生の体験談が書けたことも要因だと思います。「WiFiを探さなくて良くなりストレスが減った」というリアルな感想を書きました。他のサイトをみてみると、実際に使っておらず調べて分かる範囲で書いてある記事も結構見受けられます。
はてブ有料会員化の効果？
実は、この記事を書く1週間前にはてなブログの有料会員になりました。2年契約で14400円なのでけっこう大きな買い物です（汗
はてなブログを始めて約3年半。ついに有料会員になりました！2年契約で14400円。ブログ収益化してないのにw
— ちーさん♨️web系銭湯女子 (@igaiga115) May 6, 2019
赤字だけど、ブログは自分にとって大切な趣味だから趣味に使ったと考えればいいお金の使い方！
今日は有料会員でできるようになったブログの細かいカスタマイズをしていきます。#はてなブログ pic.twitter.com/tXKYgfVU7P
有料会員化によりできたこととしては、TOPページのカード表示と広告の削除です。
これがどれほど評価されたかは分かりませんが、ブログとして見やすくはなっているので何かしら影響した可能性もあると思います。
まとめ
今回のアクセスアップは、正直まぐれで一時的なものでしたが、ここから色々と学ぶこともできました。
レビュー記事を書くときは、なるべく他の人がまだあまり書いてない商品やサービスを攻めてみることやメリットとデメリットを両方書くということは今後も意識したいと思います！
最後に記事を載せておきます。
また、記事のダイジェスト版として動画も作ったので、記事読むのが面倒な人はこちらをどうぞ！45秒で見れます。
「どんなときもWiFiで通信料金を節約しよう！」【#ちーはっく】
ではまた！
通信量無制限のモバイルWiFi「どんなときもWiFi」を契約してWiFi乞食から卒業できました
こんにちは！IT女子のちーさんです。
先月末に、どんなときもWi-FiというモバイルWiFiを契約しました。私はこれまで外出先でWiFiを常に探して彷徨うWiFi乞食でしたが、どんなときもWiFiにしてからそういうこともなくなりストレスフリーになりました。この記事では、どんなときもWiFiについて紹介しつつ自分の体験も混ぜておすすめポイントを解説したいと思います。最後にお得な申し込み方法を紹介します。
- どんなときもWiFiって？WiMAXとの違いは？
- どんなときもWiFiの料金
- どんなときもWiFiこんな風に使ってます
- 金銭的コスト削減
- 精神的コスト削減
- どんなときもWiFiの注意点
- どんなときもWiFiはこんな人におすすめ
- お得な申し込み方法
どんなときもWiFiって？WiMAXとの違いは？
どんなときもWiFiは、巷でよく聞く「WiMAX」や「ポケットWiFi」と何が違うのでしょうか？
図で説明します。
まず、端末を持ち歩いて外出先などでWiFiが使えるサービスの総称を「モバイルWiFi」と呼びます。どんなときもWiFiもモバイルWiFiのひとつです。自宅に機械を設置してインターネットができるサービスは、固定回線です。
WiMAXとポケットWiFiとの違いは、どの会社が回線を提供しているかです。「ポケットWiFi」は、Y!Mobileが提供しているモバイルWiFiのことで、「WiMAX」はUQコミュニケーションズが提供しているモバイルWiFiのことを指すそうです。
私はてっきり「ポケットWiFi」は一般名詞だと思ってたのですが、サービス名だったんですね。
ポケットWiFiよりもWiMAXの方が安くて通信速度も速いそうで、様々な販売代理店がWiMAX回線を借りてサービスを提供しています。「ブロードワイマックス」や「GMOとくとくBB」なども、WiMAX回線を使ってサービス提供している代理店です。
一方、どんなときもWiFiは、Y!mobileの回線もUQコミュニケーションズの回線も使っておらず、基本的にau、ドコモ、ソフトバンクのLTE回線を使っています。「クラウドSIM」という新しい技術によってその時に最適な回線を選んで接続してくれるようです（通称「クラウドWiFi」）。
これは海外にも対応しており、海外でどんなときもWiFiの電源を入れると、現地の回線から最適なものを選んで接続してくれます。
※海外利用は、日別計算となり別料金です。
※海外利用の際は、1日1GBまでの制限があります。
これまでのポケットWiFiやWiMAXは、回線提供会社が1社だったため、通信量無制限と言いながらも「3日で10GBを越えると一時的に制限がかかる」などの制限がありました。
どんなときもWiFiは、1つの回線に縛られないクラウドSIMという技術を使ってることで、通信制限もなく格安にモバイルWiFiを使うことができるようになりました。
どんなときもWiFiの料金
料金体系はかなりシンプルで、「2年間月3,480円」の一択です（※別でキャンペーンなどがあるケースがあります）。他の会社だと、プランが複数あったり、キャッシュバックがあったりと分かりにくいのですが、どんなときもWiFiではプランで迷う必要がありません。
3,480円って安いの？と思われる方もいると思いますが、これは安いです。私がざっと調べた感じ、WiMAXで安い会社だとキャッシュバックなど諸々考慮して月額でならした金額で大体3,200〜3,500円くらいというのが、安い方のモバイルWiFiの相場でした。でも、WiMAXだと速度制限があるので、そこを考慮すると数百円のプラスであれば十分支払う価値があると思います。
どんなときもWiFiこんな風に使ってます
ここから私が実際に使ってみた感想を述べたいと思います。
私は、もともと家の固定回線でWi-Fiを使って、外出先では格安SIMまたはお店などのフリーWi-Fiを使うという生活をしておりました。
しかし、ブログや動画編集は外出先でやることが多く、いちいちWi-Fiスポット探したり、毎回WiFiを接続したり、毎月の通信料を気にするのが結構ストレスでした。そのストレスから逃れるために、固定回線を解約して、モバイルWiFiに切り替えることにしました。
どんなときもWiFIを契約してからは、家では常にWiFi、外出先でもほぼ常にWiFi、Wi-Fiから離れた時や電源が切れた時だけ格安SIMというふうになっています。ほぼ常にWi-Fiに接続されているような感じです。
もはや歩くWiFiと化しています（笑）
端末の電池は12時間保つので使わないときは切りつつ、毎日充電して、1日は余裕で保ちます。実際に現在契約している格安SIMの通信使用量を見ると、一目瞭然です。5月4日からどんなときもWiFiを使い始めました。
私が使っているBIGLOBEモバイルは、毎月使用量が繰越しできたり、アプリから簡単に料金プランの変更ができるので、おすすめです。友達紹介キャンペーンを使うと1ヶ月分無料になります！
どんなときもWiFiに切り替えたことで、金銭的コスト以外にも精神的コスト削減ができているのでそのあたりも解説したいと思います。
金銭的コスト削減
まずは分かりやすいお金面の節約から。
WiFi代
Wi-Fi代については、もともと安い固定回線を契約していたので、月4,000円位でした。どんな時もWi-Fiにして月額3500円くらいになったので月々約500円の節約です。ただ、固定回線の違約金が8,000円位がかかったので、向こう半年くらいはプラマイゼロという感じでしょうか。
格安SIM代
先ほど紹介したように、どんな時にWi-Fiにしてから格安SIMの通信をほとんど使わなくなったので、格安SIMのプランを1番安いものに切り替えようと思います。現在契約しているBIGLOBEモバイルが、今までは月6GBで2,000円のプランでしたが、3ギガの1500円のプランにしようと思います。これでWiFi代と合わせると、月1,000円位の節約になります。
こちらの記事もオススメ
カフェ代
これは見えにくい部分の節約ですが、カフェに使っていたお金を節約できると考えています。外で作業するときに、多少高くてもWi-Fiがあるカフェを選んでいたことがあるので、今後はWi-Fiがあるかどうかを気にせずになるべくお金のかからないカフェに行くことができます。
精神的コスト削減
金銭的なコスト削減は、月々1000円+ α位でしたが、私にとっては精神的コスト削減の方がメリットとして大きかったです。
どんなときもWi-Fiに切り替えたことで、どんなふうに楽になったか説明したいと思います。
変なフリーWiFiに接続されなくなった
街を歩いていると、ふいによくわからないフリーWi-Fiに接続されて、通信が切れることをよくありませんか？どんなときもWi-Fiに切り替えて、常に自分のWi-Fiに接続するようになってから、それがなくなりとても快適になりました。どんなときもWiFiは、BIGLOBEモバイルの回線よりも通信速度も早く、外でのネット環境がとても良くなりました。
セキュリティへの不安がなくなった
カフェなどで接続するフリーWi-Fiはセキュリティーの不安がありました。それでもなるべく通信量を抑えたかったので繋いでいましたが、今はそのセキュリティーの不安もありません。
WiFiを探す手間がなくなる
どんな時もWi-Fiにしてから、いちいち外でWi-Fiスポットを探さなくて良くなり、とても楽になりました。このWi-Fiを探すという作業は結構大変です。なぜかというとネットにあまり情報がないからです。なので、最近は確実にWiFiのあるチェーンのカフェやカラオケに行ったりしてました。
こちらの記事もオススメ
WiFiの有無に一喜一憂するのもけっこう疲れるのですが、それもなくなりました。
どんなときもWiFiの注意点
どんなときもWiFiの注意点についてもまとめます。
接続デバイス台数は5台まで
どんなときもWi-Fiで選べる端末は1種類のみで「U2s」という端末です。
サイズも重さもスマホと同じくらいとなっており、かなり持ち運びしやすいです。
ただし、同時に接続できるデバイスは5台までとなっています。
5台と聞くと十分のように思えますが、例えば家族みんなで使いたい人やスマートホームをしている人にとってはちょっと足りないかもしれません。
私の場合、一人暮らしなのですが、デバイスはスマホ、タブレット、パソコンでWi-Fiを使っており、さらにGoogleHomeminiとNatureRemoにも繋がないといけないので、それでMAXの5台を使ってしまいました。
こちらの記事もオススメ
ギリギリ足りたのでよかったのですが、この先デバイスが増えたときにどうしたらいいかわかりません。
ときどき接続が切れる
固定回線の時は、急に接続が切れるという事はなかったのですが、どんなときもWiFiの場合、たまに接続が途切れます。端末の電源を入れ直したり、少し待つと回復します。
どんなときもWiFiはこんな人におすすめ
どんなときもWiFiをおすすめしたい人をまとめます。
一人暮らしの人
モバイルWiFiをおすすめしたいのは、一人暮らしの人です。一人暮らしだと、家に固定回線でWiFiがあっても、出かけている時間は使われることがないのでその分無駄になってしまいます。それであれば、少し料金が安いどんなときもWiFiに切り替えて、料金を下げたほうがいいと思います。逆に家族が多いと、接続端末が5台までとなっているのでちょっと物足りないと思います。また、自分が外出先にWiFiを持っていってしまうと家族は家でWiFiが使えないということになってしまいます。ただ、パートナーや子供があまりWiFiを使わない家族であればアリだと思います。
外出先でよくWiFiを使う人
フリーランスやブロガーの方は、外出先でPCをカタカタすることが多いと思います。その度にフリーWiFiを探すのは本当にストレスです。それであれば、どんなときもWiFiを常備して歩くWiFiになりましょう。
通信量無制限なので、友達と一緒に作業するときもWiFIを貸してあげることができて感謝されることでしょう。
ポケットWiFiやWiMAXの通信制限に困っている人
最初の方でも説明した通り、従来のモバイルWiFiは「3日で10GB」といった制限がありました。通常のネットサーフィンでそれを越えることはほぼないと思いますが、動画をたくさんみたり、ライブ配信などをすると超えてしまうこともあると思います。通信制限に悩んでいる人は、今すぐどんなときもWiFiに切り替えましょう。料金はそんなに変わらないはずです。
格安SIMを使っている人
どんなときもWiFiは、格安SIMとの併用におすすめです。格安SIMのメリットは、使う通信量に合わせて安いプランを選択できることです。まだ、キャリアで契約してる人はこれを機にどんなときもWiFiと同時に乗り換えるのもありですね。
こちらの記事もオススメ
外出先でのネット利用をほぼどんなときもWiFiにすれば、格安SIMの一番安いプランで間に合うと思います。スマホの通信量が多い人は、月額の通信料金をかなり抑えることができます。
海外によく行く人
どんなときもWiFiは、クラウドSIMなので海外でもそのまま使えるそうです。通常、海外でネットを使うには現地のSIMカードを買ったり、空港でモバイルWiFiのレンタルをしないといけないですが、それなくしてネットが使えるのでかなり楽だと思います。
お得な申し込み方法
どんなときもWiFiを申し込むときに、普通に公式サイトから申し込むのではなく「自己アフィリエイト」または「ポイントサイト」経由で申し込むとキャッシュバックがもらえます。
自己アフィリエイト
自己アフィリエイトとは、自分で申し込んでアフィリエイト報酬をもらう方法です。これをやるには、アクセストレードなどのASPのサービスに登録する必要があります。登録は無料ですが、サイトの審査があるので、自分のブログなどを持ってる人向けです。はてなブログやアメブロなどで無料で作っても大丈夫です。
どんなときもWiFiをASP経由で申し込むと、現金で5,000円くらいもらうことができます。
※報酬は変更になる可能性があります。
※報酬は口座振込なので手数料が引かれる可能性があります。
ポイントサイト
ポイントサイトは、自分のサイトを持っていなくても会員登録をして使うことができます。基本的には現金ではなく、そのサイトで使えるポイントが貯まります。貯まったポイントは、Amazonギフト券などにすることができます。GetMoneyというポイントサイトでどんなときもWiFiの取り扱いがありました。
通信制限や通信料金に悩んでいる人は一度検討してみてくださいね。
Voicyのチャンネルがランダム表示される【Voicyチャンネルルーレット】作った！ソースコードも大公開しちゃいます
2019/11/9更新：新たにチャンネルを63個追加しました。
こんにちは！IT女子のちーさんです。
CodeCampで学んだプログラミング知識を生かしてちょっとしたwebサービスを作ったので、コードの中身を大公開してどうなってるのかを解説しようと思います。ソースコード解説の部分は、パッと見難しいですが、私自身エンジニアではないので、エンジニアじゃなくても理解できるように優しい言葉で解説しました。
プログラミングにちょっとでも関心がある方はぜひコード部分も見てみてください。興味ない人はルーレットで遊ぶだけで全然OKです！
作成したサービス
今回作ったのは「Voicyチャンネルルーレット」というもので、Voicyで配信されているチャンネルからランダムにチャンネルを表示するというサービスです。
Voicyチャンネルルーレットの遊び方
使い方はあなた次第！ですが、主な用途を紹介します。
新しいチャンネルとの出会いに
VoicyアプリのUIだと、ランキングや新着がメインになっており、埋もれているチャンネルも多くあるので、「こんなチャンネルもあったんだ」という出会いの場にご活用いただければと思います。
昔配信されていたお宝チャンネルとの出会いに
Voicyチャンネルルーレットは、昔配信されていたチャンネルも含まれています。
Voicyのチャンネルは月更新制になっており、更新がされなかったパーソナリティは「配信終了」という形でその後配信されなくなり、アプリのランキングやおすすめにも表示がされなくなります。しかし、アーカイブは全て残っているので、過去回を聴くことでコンテンツを楽しむことができます。
有名なあの人も実はVoicyで配信していた⁈なんてことが分かるかもしれません。
ビンゴゲームをする
先日長野で開催されたVoicyのチャンネル「ろりラジ」のオフ会で、Voicyチャンネルルーレットを活用した「Voicyビンゴゲーム」で遊んでみました。
Voicyビンゴ
— いろは (@iroha_iro_tw) May 4, 2019
「#あいにゅー （リーチ）」
「#ろりラジ（ビンゴ）」
で、1番ぬけ♡ pic.twitter.com/Ogu8mB9u0W
#ろりラジ
— 村田 優介 (@yusukeb28513086) May 4, 2019
ビンゴ大会
知らないチャンネルも知れて面白い！ pic.twitter.com/uYGtsZ85V6
詳しいやり方は、こちらのページで解説しているので、参考にしてみてください。
ルールはろりラジ仕様になっているので、適宜修正いただければと思います（笑）
【ゆるぼ】ボランティアさん募集
Voicyでは、月初めにどんどんチャンネルが追加されていきます。
チャンネルIDから新しい配信URLを調べて、データに「チャンネル名」と「パーソナリティ名」を書き加えてくださる方を募集します（笑）
「追加したよ」と私にDMいただければ、データベースを更新して最新チャンネルもルーレットに出るようにします。
「やってもいいよ！」という方がいらっしゃれば、DMをいただけましたら、Voicyの配信URL一覧スプレッドシートを共有いたします！
まぁ、自分でもできるので気が向いたら自分でやります（笑）
では、ここからはプログラミング的な解説になります。
サービスの全体像
使った言語は、「HTML」「CSS」「PHP」「MySQL」「JavaScript」です。JavaScriptは一行だけで、動かす部分はほとんどPHPで作りました。
さらに、データベースとの連携もしています。
サービスの構造は、先日公開した銭湯サイトの簡易版となっています。
VoicyのチャンネルのURLには、数字が割り振られており、新しいチャンネルになるにつれて数が大きくなっています。今回は、この仕組みを利用してサービスを作りました。
ちなみに、Voicyファンラボ同期の「や」さんが書いたノートに一覧が載っています。
データベースには
・No
・配信中のURL
・チャンネル名
・パーソナリティ名
の4列のデータが入っています。
チャンネル名とパーソナリティ名のデータ収集は、ろりラジリスナーのあおいさんにご協力いただきました。
開発環境は、CodeCampのシステムを使ってるので、ドメインが「codecamp」になっています。
ソースコード解説
それではここからソースコードを解説していきます。ここから先はPCでの閲覧推奨です。
前半部分がルーレットを回すための下準備、後半部分がデザインとなります。
データベースに接続する
まず、別で「phpMyAdmin」に保存しているデータベースを読み込む必要があります。「const.php」というファイルにphpMyAdminのログイン情報が記載してあるのでそれを呼び出します。「$link〜」と書いてあるコードでデータベースに接続することができます。これは、いつも同じ書き方なので「こういうもの」として覚えます。
変数を定義する
ルーレットを回すために、変数を使う必要があります。変数とは、データを入れる箱のようなもので、状況に合わせて中身を変えることができます。
まず「$rand」という変数ですが、これはランダムに出す数字を入れるための箱です。「$data」は、「配列」と呼ばれる変数の書き方で、配列にはデータを複数入れることができます。
変数を使うときは、いきなり処理をすると「この変数はなんなんだ」というエラーが出るので、使う前に「$rand=''」のように初期値を設定しておく必要があります。
「mt_rand()」は、「関数」です。関数は、色々計算したりデータを処理したりするための命令文のようなものです。エクセルで使われてるSUM()とかも関数ですね。
「$rand=mt_rand(1,432)」と命令すると、ページを読み込むごとに1~432からランダムに数を取ってきて、$rand変数に入れるということをやってくれます。
データベースからデータを持ってくる
ここがサービスの肝となる部分です。何をしているかというと、 先ほどランダムに出した数字を元に、データベースに入っているデータを取ってくるという作業をしています。変数やら関数やら混じっていてわかりにくいですが、下記の型はデータベースからデータを持ってくるときに使う決まった構文のようなものなので、そのまま覚えて使うのが良いと思います。
if ($link) {
$query =（処理内容）
$result = mysqli_query($link, $query);
while ($row = mysqli_fetch_array($result)) {
$data = $row;
}
まず、データベースと接続しているならばというif文を作って、$queryという変数の中に処理内容を書きます。この処理内容の記述は、PHPではなく、「MySQL」というデータベースを操作するための言語で書きます。
処理内容の「'SELECT * FROM VoicyID WHERE NO='.$rand」は、「VoicyID」というテーブル（表）から「NO」列で「$rand」と一致するデータを引っ張ってきて、という命令です。以下のようなデータが入っているので、もし$randで「1」が出たら、一行目のデータを引っ張ってくることができます。
ここまでやると、サービスの根幹は大体完成です。
あとは、デザインをして、引っ張ってきたデータを適切なところに出してあげればOKです。
ちなみに、この処理の後「$data」のデータの中身を表示すると以下のようになります。
ちょっとややこしい感じで書かれてますが、ちゃんと「イケハヤラジオ」や「イケハヤ」といった必要なデータが入っているのがわかると思います。
データの中身を意味ごとに改行するとこんな感じ。
array(2) {
[0]=> array(0) {
}
[1]=> array(8) {
[0]=> string(3) "237" ["NO"]=> string(3) "237"
[1]=> string(28) "https://voicy.jp/channel/585" ["URL"]=> string(28) "https://voicy.jp/channel/585"
[2]=> string(22) "#イケハヤラジオ" ["channel"]=> string(22) "#イケハヤラジオ"
[3]=> string(12) "イケハヤ" ["personality"]=> string(12) "イケハヤ" }
}
「array」は配列という意味で、()はデータの個数です。 $dataには2重で配列が入っていて、「[0]=> array(0)」 は空になっており、「[1]=> array(8) 」に必要なデータが入っています。数字で紐づいているのとデータベースの列の名前で紐づいているのが2つずつ入っていますね。「string(3)」というのは、3文字以内の文字列が入ってますという意味です。このデータ取得に成功すれば、あとはPHPでweb上にデータを表示できます。
サービスページのheadを作る
ここから先は、webサイト上で見える部分になります。上記は、HTMLでwebサイトを作る時の定型文です。使用するHTMLの種類やCSSの情報、ページタイトルなどが書かれています。
データを表示する
ここが見た目で一番目立つ「このチャンネル！」枠の部分です。見出しや枠などのデザインは、「copypet」というとてもセンスがいいデザインサイトからコピペしたものをカスタマイズして実装しました。
ちなみに、この部分はHTMLとPHPが混ざっているのですが、PHPを書く場合は<?php ?>で囲った中に書かないとエラーになります。
$dataのデータを表示するために「foreach」というPHP言語の関数を使っています。これは繰り返し処理をするための変数で以下のように使います。
foreach( 配列 as 値を入れる変数）{
繰り返し行う処理内容
}
foreachの中にある「isset」も関数ですが、これは()内の変数に値が入っているかどうかを調べる関数で、入っていたら「TRUE」となります。「if (isset($value) === TRUE)」は、$valueという変数に値が入っているならばという意味になります。これをしないと$valueに値が入っていないときに処理できなくなりエラーとなります。
処理内容の「<?php print $value['channel'];?>」は、$valueの中に入っているデータのうち「channel列」のデータを表示してね、という意味です。URLやパーソナリティ名も同様に表示させます。
ボタンを作る
最後に、押すとページを読み込むボタンを作ります。ここだけ一瞬JavaScriptの登場です。「onclick="window.location.reload()"」という処理が「クリックでページを読み込んでね」ということです。
これで、
⒈ボタンを押すたびに$randの値が変わって
⒉その値に基づいてデータベースからデータを取ってきて
⒊表示する
という一連の流れが完成します。
長々と解説してみましたが、よくわからない人は遊ぶだけで全然OKです！ぜひ遊んでみてくださいね。
それでは！
【図解】WEBサイトの仕組みってどうなってるの？レストランに喩えてみた
こんにちは！IT女子のちーさんです。
昨日の記事で、銭湯のサイトをプログラミングを使って作った話をしました。
そこで学んだこととして、WEBサイトの裏側の仕組みをここでまとめておきたいと思います。そのままだと取っつきにくいのでレストランに喩えてみました。
続きを読む
動画作成を毎日つづけるために工夫していること
オンラインサロン（能動的な有料コミュニティ）に所属するメリット
こんにちは！IT女子のちーさんです。
ここ最近、有料のコミュニティに所属する機会が増えてきました。去年は、Voicyファンラボで活動（すでに卒業）し、今年は銭湯再興プロジェクトに所属しています。
どちらも月額費用を払ってコミュニティに所属するというもので、「オンラインサロン」と呼ばれています。
ただ私が入会したオンラインサロンは、「オンラインサロン」と呼ぶにはあまりふさわしくない気がします。どちらかと言うと、オフライン中心だったからです。強いて名付けるとしたら「能動的な有料コミュニティ」と呼ぶのがふさわしいでしょう。「社会人サークルにビジネス要素が混じった団体」というイメージにも近いかもです。（メンバーは、社会人がほとんどですが学生も入れます）
今回の記事では、そうした能動的な有料コミュニティのメリットを語りたいと思います。（この後の呼び方は便宜上「オンラインサロン」と書かせていただきます）
- オンラインサロンってどういうもの?
- オンラインサロンのメリット
- おすすめのオンラインサロン
続きを読む
