そよ風情報局 -初心者プログラマが独学で試行錯誤-

Webエンジニア目指して勉強中の初心者が、苦労したことや学んだ言語について書いてます。たまにゲームのことも。

Webサイト作成

レスポンシブデザイン

更新日:



現在、またWebサイトの方をいじってます。
Railsは少しお休みです( ˘ω˘)

今いじってるWebサイトに手を加えたこととこれから加えることを書いていきます。

 

手を加えたこと

実はスケジューラアプリに不具合がありまして、それをずっと放置してました(
どのような不具合かと言うと、

同じユーザ名が登録できてしまうのです!!

かなり深刻なやつですはい。
公開時に知ってはいて、直さないとなーって思ったまま忘れてましたw

内容自体はすごく単純で、入力した文字をDBから検索するんですが、その際for文とif文を使うんですよね。
if文の中にfor文を書かなければいけなかったところをfor文の中にif文を書いてしまってて動作が変になっていました。。。
ちゃんと見たら一瞬で解決したんですけど、書いてるときは気づかないものですね。

実はまだ不具合残ってるので、またちまちまと修正していきます。。。

 

これから手を加えること

レスポンシブデザイン化

これが今回のメイン。

いい加減レスポンシブデザインにしないといけないと思って今回手を加え始めました。
やっぱり今ってスマホからWebページを見る人が増えてるので、対応が必要だなと。
今のままだと見れはするけど非常に見づらいですしね。。。

以前、スマホ用サイトを作ろうとして手を付け始めたんですが、どうにも表示がうまくいかず投げてたんですよね。
なので今回はレスポンシブデザインでやってみようかなと。

スマホ用サイトを別途作る方は、基本的に今あるサイトに手を加える必要なく新たに追加するだけでいいため、ある意味楽なんですが、何か変更や追加があったとき両方に手を加えないといけないという手間がありますし、同じようなものを2つ作るって気分的になんか嫌だなと(笑

結局レスポンシブデザインにするにはBootstrap使うのが一番楽っぽいので、それ使ってページを全体的に書き直してます。
一応今回カラム化して作ってるので、それをグリッド化して書けばすぐできるんじゃないかって考えてはいます。
実際そううまくいくのかはわかりませんが・・・
一応完成図は自分の中ではできてるので、あとはそれを実現するためにひたすら書くだけって感じです。



URLの変更

これはおまけ。

いつだったか記事に書いたことですが、現状は完全別ドメインでサイトを作っているので、このブログのドメインに入れたいと考えてます。
やることは非常にシンプルで、「https://wynn-eng.com」の表記を新しいものに書き換えるだけです。
ただ、URLの記述が結構な量あるので、非常に面倒です。。。
面倒なのでずっと後回しにしてきましたが、今回手を加えるならついでにやってしまおうかとw

URLを記述するとき相対パス表記にすればこんな苦労することなかったんですが、絶対パス表記の方がSEO的によさげな気がしたものでこんなことに。
実際効果あるのかはわからないです( ˘ω˘)

 

共通部分の外部化

今回レスポンシブデザイン化するにあたって、手を加えるのって基本的にはサイドバーになります。
PCで見たときはサイドバーが表示されて、スマホから見たときはサイドバーを消してメニューボタンを右上につけるみたいなことをしたいんですが、これ全部を全ページに書くのって非常に手間です。
まぁ今のサイドバーって全ページに書いたんですけどね!(笑

それぞれのページで現在のページの欄はクリックできないようにして、スライドは開いた状態にして、みたいなことをしてたんですが、さすがにそれ全部書き直すのは面倒だったので、外部化してしまおうかと考えてます。

全ページからサイドバーの表記を消して、サイドバーを表記するためのファイルを作ってそこにまとめてしまおうかと。
最初のページを作ったときはカラムのそれぞれでファイルを作ってそれで何となくそれっぽいものを作ってましたが、動作怪しい部分もあったので、今のページにリニューアルした際にやめてしまいました。
でも、やっぱり外部化させるのは今後変更等あったとき便利だと思うので、頑張って実現させようかなと。

 

最後に

とりあえず、こんな感じで考えてます。
あんまり時間かけずさっさと終えたいところではあります。。。

あと、スマホ繋がりで(?)アプリ化も実現したいとは思ってます。
もう少しスケジューラの方作り込んで、アプリストアに並べたいなと。

少し調べてみた感じだと、そこまで苦労せずにWebアプリをスマホアプリ化できるような?
でも毎回サーバと通信するのもなーとか本体に保存したいなーとか考えると結局は苦労しそうw

やることいっぱいなので、時間見つけて早く進めていきたいです。







-Webサイト作成

Copyright© そよ風情報局 -初心者プログラマが独学で試行錯誤- , 2018 All Rights Reserved Powered by STINGER.