mayutech’s blog

WEB開発(バックエンド・フロントエンド)デザインのことまで幅広く書いていきます

1秒でbootstrapを使ったページが作れる「Bootstrap Editor」のススメ

書きました

 

‪ 1秒でbootstrapを使ったページが作れる「Bootstrap Editor」のススメ

http://qiita.com/mayutechIOG/items/33ed210f58b649ce261b

 

bootstrap editorのテンプレート機能で

ベーシックなグリッドを使用したページ、ブログ、ランディングページをすぐに作成することができます。

 

bootstrap初心者の方

いちからページを作成するのが面倒な方などにぜひオススメなので

活用してみてください

 

 

 

再度Laravel5にReactを導入することになった未来への自分へ

再度Laravel5にReactを導入することになった未来への自分へ

このサイトが大変参考になった。導入までいけたのでぜひ活用してほしい。

 

blog.mudatobunka.org

充実した3連休

土曜日は一日ゆっくりお休みした

 

日曜日と月曜日で色々なことをやった

 

Pythonの試験のため、Pythonチュートリアルを第5章まで読んで勉強した

GitHubにZenHubを導入した

・Qiitaに記事を2つ書いた

 →アジャイル開発におけるストーリーポイントをFP法で算出する

 →ZenHubでストーリーポイントが出ない時の対応方法

・Laravel elixirを用いてreactを導入した

 

休日は家でやると効率が良いことがわかったので続けたい!

個人でのWeb開発にもオススメなAtomicDesignとAPB CSSの紹介

CSS設計はむずかしいので「シンプルに」かつ「メンテナンス・拡張可能」なCSS設計をしたい!
・エンジニアらしく構造的なCSS設計をしたい!
・個人で最初はモックアップ程度に開発して
ゆくゆくはチームで開発してもっと大きくしていきたい!

 

という自分の要望に応えてくれた

AtomicDesignとAPB CSSについてまとめました。

 

qiita.com

Qiitaでいいね!がつけられやすい記事を書く題材として◯◯な技術が良い

Qiitaに投稿した記事にcontributionがつけられた総数が20になった。

(contributionとは・・・記事につけられる「いいね!」のこと)

 

改めて、いいね!をつけて下さった方、有難うございました!!

6月中には、20いきたいなと思っていたが達成して良かった。

 

そこで、ネットを見ても、Qiitaの投稿で「いいね!」を増やすにはどうしたらいいかというのが書かれていなかったというのもあり、

本記事では、振り返りもかねて、「いいね!」がつけられやすい記事というのは何かということを書きたいと思います。

 

いいね!がつけられやすい記事は主にこの2つ

①今注目されている技術について

②需要があるけどまだ知られていない技術について

 

①今注目されている技術について

フロントエンドでは、React.js

CSSデザインでは、Atomic Design の記事が他のSQLとかバージョン管理の記事より いいね!をもらいました。

昨今、2つとも注目を浴びているWeb開発の技術なので関心が集まったということでしょうか。

qiita.com

qiita.com

需要があるけどまだ知られていない技術について

 

エンジニアでもデザインがしたい!

だけどフォトショやイラレなんて学習コスト高そうだし使うまでの時間がない

という方に向けて Canvaというオンライン上で使えるデザインツールについて書きました。

この記事が現時点で一番いいね!の数をもらいました。

qiita.com

おわりに

まだ登録だけしてて記事は書いたことがないという方へ

 

・上記のような技術をキャッチアップした時に

・アウトプットとしてもくもく作った時に などなど

備忘録としてQiitaを活用すると

自分の知識のアウトプット+いいね!もつけてもらえて成長につながると思うので

どんどん投稿していくと良いのではないかなと思いました。

 

目安としては、週1ぐらいのペースがちょうどよいかもしれません。

(週の終わりにまとめとかでも)

下記の記事が週一投稿を行っているユーザーさんなので

参考になさってみてください。

qiita.com

blog.makotokw.com

 

以上

Qiitaをデザインする~見出しの下線を緑色にしてみた~

qiita.com

あるようでなかったQiitaの見出しの下線を緑色にする

Chrome拡張機能

みんなデザインとかそんな気にならないのかな?!

タイトルと見出しの色統一したほうが綺麗ですよね?!と思って

つくりました。

 

Chrome拡張機能の作り方がわかりました。

自分がこうなってほしい画面になって嬉しかったです。

transitkixさんの「つよいUI」を読んだ

 

transitkixさんの「つよいUI」を読みました。

transitkix.hatenablog.jp

 

 

まず、「つよい」とは

上記のブログでは、あらゆる状況において耐久性があること と定義しています。

 

また、あるユーザーさんから、つよさはやさしさとコメントがつけられており、

この言葉から私自身、つよいUIとは、

ユーザーが使いやすく、また安全性が担保されたUI  であると思いました。

 

ブログの記事の中でつよいUIを構成するに何を意識すべきかの項目が挙がっておりまして、

中でも自分が作るとき、考えたい項目を以下でピックアップしました。

 

1.本来、そこにあるはずの情報がない場合はどうなりますか?

 

4.ロード中、もしくはロードされるまで何が出ていますか?

 

5.予期せぬエラーが起こった時、画面はどうなりますか?

 

主にエラー処理をUIの面でどう改善するか、についてはあまり考えてこなかったなぁと。

 

下記のフロントエンド養成読本でもマズロー欲求階層説になぞられて

機能面は、最低保証品質と書いていました。

 

f:id:mayutech:20170621120212j:plain

フロントエンド養成読本

 

 

 

エラーが起きてもユーザーが不安にならない

UIを作ることが必要であるなあと思った次第。

 

あと、画面改善に

社内でデザイナーさんも巻き込んでディスカッションしたり

play tech(旧dots)でディスカッションしたりして、色々な視点から

つよいUIをより強くしたら面白そうだなぁと思いました。

 

かたい話だけれども、もっとこうしたほうが良いとか

面白く進めればいいなぁ。

 

まゆtech