サイトの制作を始めました。その経緯とお世話になったツールを紹介します。

この度、浦和レッズの応援サイトを作ることにしました。その経緯とお世話になったツールを紹介します。


なぜ作ったか

最初に私がこのサイトを作ったのは2006年の高校生の時でしたので、10年も経ち、そろそろ作り直したいなと思い、リニューアルすることにしました。

また、もっとスタジアムに足を運んでもらうために、初心者に優しいサイトを作ろうと思います。

当時のコンテンツは応援歌と画像でしたが、少しプログラミングなどの知識を付けたので、もっとコンテンツを増やしたいと考えています。

今後の予定

今、考えているコンテンツは以下です。

  • 観戦ガイド
  • カレンダー(試合とか選手の誕生日とか)
  • 試合結果
  • 順位表(過去シーズンのインポート)
  • 選手一覧

などです。 特に初心者のための観戦ガイドをじっくり作ろうかと思ってます。
なのでサイト名は「浦和レッズ観戦ガイド」にしました。
何かアイデアがあればご教授をいただけたら助かります。

お世話になったツール

お世話になったフレームワークやライブラリの紹介です。

ロリポップ

サーバは格安サーバのロリポップです。
全くトラフィックは無いので重くは無いです。
ただ、共有サーバなので深夜はまれに503が出ることがあります。
https://lolipop.jp/

お名前.com

ドメインの取得は定番のお名前.comです。
このドメインは中古ドメインのようで、2000年ぐらいはレッズサポに紛れた出会い系、2006年頃はクレジットカードのサイトでした。
http://www.onamae.com/

CakePHP

PHPのフレームワークであるCakePHPで作っています。
プログラミング初心者の私にとってはMySQLが手軽にできるのが嬉しいです。
https://cakephp.org/jp

Michelf

MarkdownをHTMLに変換してくれるPHPのライブラリです。
Markdownで書くのが好きなので、このブログもmarkdownで書いて、サーバ側でHTMLに変換しています。 ただ、tableタグが変換できないのが不満です。
https://michelf.ca/projects/php-markdown/

simple html dom

PHPのスクレイピングライブラリです。
アンテナページで使用しています。 浦和レッズの公式サイトはRSSが無いのでスクレイピング(HTMLを解析)して、 更新情報に入れています。
http://simplehtmldom.sourceforge.net/

twitteroauth

Twitterの認証ライブラリです。
@urawareds_botで選手のブログを更新するとTwitterに自動投稿するアカウントも当システムで動いています。

ionic

ここからはフロントエンド編。
スマートフォン向けのCSSフレームワークです。
デザインが良くとても使いやすいです。
○ュビロや○クルトのスマホアプリでも使われています。
https://ionicframework.com/

colorbox

画像の拡大する定番のjQueryライブラリです。
http://www.jacklmoore.com/colorbox/

jQueryAutoHeight.js

要素の高さを揃えるjQueryライブラリです。
https://github.com/tinybeans/jQueryAutoHeight

Sass Compass

CSSはSass+Compassで書いてます。

Prepros

Sass+CompassのコンパイルとJavaScriptの圧縮ができるGUIツールです。
Gulpを使おうとしたら、コンパイルに時間がかかるので、今回はこれを使用しました。
https://prepros.io/

Bitbucket + SourceTree

バージョン管理ツールはGitで、 GitはBitbucket、ソフトはSourceTreeを使っています。

最近の記事

金武町フットボールセンターに2019年浦和レッズの沖縄キャンプを観てきた

2019年度の浦和レッズのキャンプ地である沖縄の金武町フットボールセンターに行ってきました。バス停やバスでの行き方の説明や、キャンプのレポートです。

浦和レッズの波瀾万丈だった2018年シーズン振り返る

2018年シーズン浦和レッズの総括です。堀・大槻・オリヴェイラと監督が2度変わり波瀾万丈だったシーズンを振り返ります。

【天皇杯優勝!】天皇杯決勝 ベガルタ仙台戦の画像レポート(主にサポーター)

2018年12月9日(日)、天皇杯決勝 浦和レッズvsベガルタ仙台の画像レポートです。ビジュアル・コレオグラフィーやWe are DIAMONDSの画像を掲載しています。

【アウェイ遠征】天皇杯準決勝 鹿島アントラーズ、茨城県立カシマサッカースタジアムに行ってきた

2018年12月5日(水)、天皇杯準決勝 浦和レッズvs鹿島アントラーズを観戦してきました。茨城県立カシマサッカースタジアムの様子をレポートします。

【アウェイ遠征】湘南ベルマーレ戦、Shonan BMW スタジアム平塚に行ってきた

2018年11月24日、J1リーグ第33節 湘南ベルマーレvs浦和レッズを観戦してきました。Shonan BMW スタジアム平塚の様子をレポートします。

初観戦!浦和レッズレディースの試合を観に浦和駒場スタジアムに行ってきた

2018年10月28日、浦和レッズレディースvs日体大FIELDS横浜の試合へ浦和駒場スタジアムへ行きました。

目次