Web系言語を勉強がてらプロフィールサイトを作る #1


ブログ自体を『備忘録』用途として使っているのにカテゴリーでまた別に
『備忘録』を用意していて今まで冗長なことしていたと気づく今日このごろです。

 

これから自分用のプロフィールサイトの制作過程を記録していきたいと思います。 
 使用言語:Laravel (PHPフレームワーク)、その他もろもろ

※プログラムのことを書きますがコードを載っけたりはしませんのであしからず。

 

 

 

動機

 学生時代は主にandroidWindowsなどのアプリ開発(趣味程度)をする
 言語(JavaWPFvb.net)を触っていましたが、Web系やスクリプト言語
(分類する言葉にあまり明るくない)は全くと言っていいほど触って来なくて、
 むしろ食わず嫌い的苦手意識があるくらいでした。

・<○○>が多すぎて全体が読みにくい

・<?php ?>の?って何意味がわからん

 など、日本語の語源は全く気にしないのに英語はじめ母国語以外を
 勉強するとなぜか起源を知りたくなる病を患っていました。
 

 ただやはり食わず嫌いのままでは自分的に許せなかったことと
 RaspberryPiを遠隔操作(ラジオ化)するにあたってローカルの
 Webページからスクリプトを送信するのが簡単ということを知り、
 いっそやるならレイアウトも・・・といった感じで勉強を始めることに。

 プロフィールサイト作成に関しては自分の使っている
 Webサービス(Twitchや落書き用の某P等々)をまとめて置きたいからです。
 ぶっちゃけ宣伝したい)以上、自分語り終わり。

 

漠然としたイメージ、搭載したい機能

・レスポンシブ。
・サイトデザインはシンプルに。
Webサービスへの誘導はアイコン+α(スクリーンネーム※要検討)
・テキトウに撮った写真とか並べられるページもほしい

  一言で表すなら

  「かっこいいページデザイン」とかで出る海外の
    すたいりっしゅ&かっちょいいページっぽくしたい(語彙力の欠如

  こんなかんじで設計もガバガバではありますが作っていきたいと思います。

  ↓現在の漠然としたイメージを表すとこんな感じ↓(作成5分

 

  f:id:kohak_d:20180620182205p:plain

  下にスクロールすると↓

  f:id:kohak_d:20180620182014p:plain

  各webサービスのアイコン(Twitterなら鳥Twitchならてれび?)と
  自分のID、使用中のアイコンなんかも取ってこれたらいいですね。
 

現在のページ状況

  最後に今のページ状況をぺたり。

  f:id:kohak_d:20180620180829p:plain

  Theサンプルを試していますといったページです。
  まだ機能を実感している段階です。

 

  正直デザインなどとは無縁の人生を送ってきたもので
  その手の感性や見方、知識が全くと言っていいほどないので
  デザインの良し悪しの基準すらわかっていないところもあるので
  そういったところも一緒に身に着けていけたらと。
  デザイン本なども読んでみたいです。

 

 

   www.twitch.tv

 主にBMSプレイ垂れ流し、Steamゲーやったりしてます。
お時間あるときによろしければ。