「Bootstrap」を含む日記 RSS

はてなキーワード: Bootstrapとは

2020-01-20

anond:20200118204308

結局自己解決しました。。。

Flotr2でグラフを描画する処理はウェブページの他の要素を全部読み込んでから実行する必要がありました。

多分Flotr2がグラフを描画した後にbootstrapがそれを上書いてしまったのだと思います

まり、onloadイベント処理で描画を実行することで解決しました。

2019-06-19

今更ながらBootstrap使ってみたけど

結構覚える事いっぱいあるな…。

サクッと管理画面とフォーム作ろうとしたけど、思いの外歯痒い。

最初Bootstrapに全部依存させて書き始めたけど、依存しすぎてかえって考えずらくなってしまう。

初めて使うフレームワークを使うとよくある事だけど、サーバーサイドと絡む所とかビルド設定で頭パンパン

使いこなしている人はすごいよ…。

2019-02-16

Vueで書いてるのにゴリゴリjQueryで動かそうとしててちゃんと動かないって言ってもそりゃーそーだよーーー

Bootstrapなんかに頼らなきゃ良かった…

2019-01-27

anond:20190127023504

例えばBootstrapベーステーマなんてそこら辺にフリーで転がってるし、お金を出せばもっとかっこいいテーマが手に入る。

才能や時間がないなら金を費やすのだ。

2018-11-21

djangoって何を目指してるの

htmlの中で

{{form}}とかやると受け取ったformを展開できて非常に便利なのだ

例えばbootstrapなどを使いたいときclass指定とかするのに困る時がある。特にテキストフィールドなど。

これに対しform.pyなどで定義した自作form内のコンストラクタclass=form-controlを付与することで対応できるそうだ。

でもそれだと何のために見た目と中身を分けているの?html内の記述対応できないと一貫性がなくない?

現にdjango-bootstrap-toolkitみたいなのがあってbootstrap4で使えるかはわからないけど

{{form | class-format}}みたいな記述ができるみたいだ。こういう方向性を目指すべきだと思うのに、何故フォーム作成コンストラクタ対応しようとするのか。

2018-06-09

はてなNG代替品作った

anond:20180323232608

はてなフィルタ - Chrome ウェブストア

https://chrome.google.com/webstore/detail/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%95%E3%82%A3%E3%83%AB%E3%82%BF/nogcpadcgpkonifnaagfghkaiiojdcap

はてなNGの代替品1.0.1を公開した

はてなNGの代替品1.0.2を公開した

はてなNGの代替品 for Firefox も作った

はてなNGの代替品 for Firefox の Android 対応

はてなNGの代替品 Chrome1.0.3/Firefox1.0.1 を公開した

機能

[対象サイト]

URL概要ブロック対象
http://www.hatena.ne.jp/はてなトップブックマーク/ブログ
http://b.hatena.ne.jpはてブトップタイル/柱/レコメンド(人気エントリーもどうぞ)/特集
http://b.hatena.ne.jp/hotentryはてブホッテントリタイル/特集
http://b.hatena.ne.jp/entrylistはてブ新着同上
http://b.hatena.ne.jp/searchはてブ検索検索結果
http://b.hatena.ne.jp/entryはてブエントリ関連記事/今人気の記事/新着/ページャー

はてなNGにあるけどフィルタにはない機能

結果

疲れた

動機

連休なので、はてなNGフィルターを作ったらクソ快適になった話

連休(GW)が明けてもアップデートされなかったので。

6月までずれ込んだのは単にやる気が出なかったからです。

公式フィルタ機能くらい用意してほしいものです。

技術

はてなNGソース眺めながら作ったので特にないです。

HaxeBootstrapは使わずJavaScript(+jQuery)とポップアップhtml手書きしてます

アイコン適当に拾ってきたフリーのやつです。

$5は払いました。

一部サイト強制非表示をどうしても解除したければソースを直接修正して開発用パッケージとして読み込めば行けますよ。

難読化はしてないので5分とかからず外せるでしょう。アップデート適用されなくなりますが。

アップデート予定

2017-11-15

anond:20171115000746

全く正しい! だからクソ案件にはBootstrapクラス命名しかしない。ある種究極のカプセル化、そこしか絶対に壊れないからな。

2017-11-14

CSS設計云々言えるのは恵まれ環境いるからだろ

Web制作において持論がある。CSS設計云々で議論できるのはまともな営業が居てまともなクライアントをつかまえてきてまともに意見を言えるからだ、そうでなければCSS設計云々は話にならない、お話にならない。

OOCSSにBEMにSMACCS、そんなもんできるかよ。クソみたいな、デザイン破壊する修正が大量に来て統一性もなにもあったもんじゃないし、セマンティック? 知るかくたばれ。アニメーションすらバラバラ指定されてっからAnimate.cssすら使えねえ。そもそも統一させてもらえないかクラス意味ほとんどねえ、全部IDでも変わんねーよ。

頑張ったよ。SASSで綺麗に書こうとしたし、Smartyみてーなテンプレートエンジン効率良いってのも分かってるよ。でもヘッダーすら変えろとか言われたらどこを共通化すればいいんだよ。

俺は確信した。Bootstrapの"mt-2"とか"display-inline-block"みたいにクラスを付けてってそれにスタイル適用してくのが正解だって。ってかBootstrapクラスばっかりでスタイル作ってる。だってクラス見るだけでスタイルが分かるし、共通化は一切されてねーからな。

あいつら、グラフィックデザインと同じだと考えてやがる、くたばれ。ポスターじゃねーんだよ。

俺はもう闇のWeb製作者になり客にはバキバキに嘘をつくようになった。SEOがだとかデバイス保有率のデータだかなんかを持ち出して出来るだけ頑張らなくて良いサイトを作る。だって頑張ったってそれはカオスを作るだけの技術が上がるだけでコーディング技術が上がる訳じゃ無いからな。

かと言って外注に出したらクソみたいに思いCSSフレームワーク使ったサイトが上がってくる、くたばれ。しかグリッドシステムぐらいしか使ってねーじゃねーか、skeletonでも使っとけ、ふざけんな。

おかげで俺は毎日Web2.0的なデザインレスポンシブ対応が混合した、パラレルワールドみたいなサイトを作ってる、スチームパンクだろ、お前営業やめろよ。単価安いんだよ。俺が営業行くから。元営業からお前より喋れるから

とにかくモジュール化だとかクラス命名手法だとか議論出来るお前らは幸運だ。全部の国がそれぞれ違う大陸にいるようなもんだ、クラスいらないからな。誰かWebpackであいつらの前頭葉をパッキングしてくれよ。

2017-10-15

anond:20171015014103

http://oreero.x.fc2.com/

まず、自分web製作会社に勤めてる身なので、一通りの制作手順は知ってる。

で、なんでこのサイトを作ったかというと、

まあ、副収入がほしかったんだ。


そして、アダルトアフィリエイトサイトなるものを教えてもらった。


ちょうどその頃、仕事以外で勉強しているものがあったが

なんせ金にならん。(※webクリエイターは金など気にせずシコシコ勉強するのが大事


で、まずはアダルトサイトを作るにはサーバを借りねばならん。

といっても、お金はかけたくない。

できれば無料で。


そして、色々調べた結果、

やはり、アダルトサイトokFC2が一番しっくりきた。

いい評判はあんまり聞かないが割と普通に動いてる。


まあ、無料なだけあって、色々縛りはつくんだよね。

最初スクレイピングで、ほぼ自動化したサイト作ればいいんじゃね!

的なことを考えていたけど、FC2無料サーバだと致命的なことに、DBサーバサイド言語が使えない。


なんだろ、webも知らない人に伝えやすく言うと、

飛車角抜きで将棋しろとか、コンバイン使わず田植えしろとか言われてるようなもんかな。


なので、フロントエンド技術(html / css/ js)だけで、RSSとかの情報取得したりしてねー的なことをしないといけなくなった。

うーん、要はドラクエで言うなら、簡単呪文は使えるけど、ほぼ素手でたたかえって言われてるようなもんかな。


とりあえず、サイト体裁を整えるためにまずは、bootstrapサンプルを改変してベースを作った。

bootstrap便利。http://getbootstrap.com/


あとは、幾つかのアフィリエイトサイト登録してパーツを配置。

動画著作権アダルト動画を載せる際の調査をして、一通りの知識を得る。


あとは、どんなサイトにするか。


ぱっと思いついたのは、普通エロサイトよりもページ遷移を無くして、

どんどん動画を見やすいようにすれば、いろんなページから探し出す手間を省けるのではと思った。


なので、構成としては、クリックしてモーダルウィンドウの中で、動画再生する形に統一

動画採取場所DMM無料サンプルとXVIDEOSおk


サイトベースは一通り完成した。


で、1ヶ月運用してみると、シングルページの弱点を身を持って体験した。

SEOにクソ弱すぎる。



どうしよう流行りのシングルページ(なんちゃって)にしたのに・・・どんどん検索順位が下る。

そこで起用したのがpushState。

jsURLを書き換える技術。ただ書き換えるだけじゃなく、履歴のもの作成してくれる。


これをすると、グーグルさんのクローラシングルページのサイトでもうまいこと動いて順位があがった。

(若干iframeとの挙動問題はあるが、ないよりまし。まあいける・・・。うん。)

てな感じです。


収益化はまだ全然できてないけど、仕事サイト作るよりも自由だし、

変更もその場で思いついたこと試せるから面白い


後半眠くて、技術よりの話になった・・・

Webエンジニアはだまって、アフィリエイトしてみるのも面白いかもね。


という感じでした。。おそまつおそまつ


最近収益どうこうより、自分が作ったサイトに人が訪問してくれるだけで嬉しくて、

淡々と息を潜めるように更新してやす


↓まあ抜いていってくだせえ。

http://oreero.x.fc2.com/

2017-10-13

敢えて今からアプリを作る必要があると言われた時の対応ガイドライン

◎ START
↓
● 既存Webサービスはありますか?-yes→● 既存WebサービスCSSをいじってスマホ対応しましょう。おわり
↓no
● そのスマホアプリ関係しそうな要素を次の中から選んでください。いくつありますか?

カメラ
マイクロフォン
3Dレンダリング
スピーカー
バイブレータ加速度センサ
GPS
BlueTooth
NFC
内蔵DB
地図
動画
Push通知
  -2つ以上→● ネイティブ一択です。端末ごとにプログラムを書くのは面倒ですが、それを明らかに上回るメリットがあります。おわり
↓1つ
● Webに置いておけば誰でも見ることができるコンテンツを、あえてApp StoreGoogle Play配信する理由はありますか?-no→● お察しの通り、Bootstrapか何かを使って普通Webサイトを作るのが良いと思います。あとでURL教えてね。おわり
↓yes
● そこまで言うなら、PWAが良いと思います。あとで追加機能が欲しいと言われたら、PWAはすぐに捨ててネイティブ移植すること。それができないならあなたの気力が尽きておわり

https://medium.com/@takeshiamano/ios-android%E3%81%AE%E3%83%8D%E3%82%A4%E3%83%86%E3%82%A3%E3%83%96%E3%82%A2%E3%83%97%E3%83%AA%E7%B5%82%E4%BA%86-7f4fc4f98656

2017-09-11

https://anond.hatelabo.jp/20170910205249

まじな話をすると、N予備校プログラミング入門コースやるのがオススメ

https://www.nnn.ed.nico

一日8時間勉強時間があるなら、だいたい一ヶ月で終わる内容。

月額1000円だけどしっかり勉強すれば一ヶ月の無料間中に終わると思う。

もともとN高等学校のノンプログラマーの生徒をWebエンジニアとして就職させるために作られたカリキュラム講師曰く去年はこれで二人エンジニア就職を決めたらしい。

内容も相当親切に説明していて、プログラミングで何か作るだけじゃなくて、就職必要な環境構築やセキュリティまでみっちりやる。

http://qiita.com/sifue/items/7e7c7867b64ce9742aee#%E3%82%B3%E3%83%B3%E3%82%BB%E3%83%97%E3%83%88%E3%82%92%E3%82%82%E3%81%A8%E3%81%AB%E6%A7%8B%E6%88%90%E3%81%95%E3%82%8C%E3%81%9F%E3%82%B3%E3%83%BC%E3%82%B9%E3%81%A8%E5%86%85%E5%AE%B9

講師が書いてる入門コースで習うことがまとめ。テキスト教材もあるけど授業も1項目を2時間で説明している。授業は週2の生放送とそのアーカイブがある。

↓みたいなことが学べる

----

Webプログラミング入門コース

Web ブラウザとは (Chrome, デベロッパーコンソール, alert)

はじめてのHTML (VSCode, HTML, Emmet)

さまざまなHTMLタグ (h, p, a, img, ul, tableタグ)

HTMLで作る自己紹介ページ (HTMLタグ組み合わせ, コンテンツ埋め込み)

はじめてのJavaScript (JS, ES6, エラー)

JavaScriptでの計算 (値, 算術演算子, 変数, 代入)

JavaScript論理を扱う (論理値, 論理積, 論理和, 否定, 比較演算子, if)

JavaScriptループ (ループ, for)

JavaScriptコレクション (コレクション, 配列, 添字, undefined)

JavaScript関数 (関数, 関数宣言, 引数, 戻り値, 関数呼び出し, 再帰)

JavaScriptオブジェクト (オブジェクト, モデリング, プロパティ, 要件定義)

はじめてのCSS (CSS, セレクタ, background-color, border)

CSSを使ったプログラミング (transform, id, class)

Webページの企画とデザイン (企画, 要件定義, モックアップ, 16進数カラーコード)

診断機能の開発 (const, let, JSDoc, インタフェース, 正規表現, テストコード)

診断機能組込み (div, 無名関数, アロー関数, ガード句, truthy, falsy)

ツイート機能の開発 (リバースエンジニアリング, URI, URL, URIエンコード)

Linux開発環境構築コース

LinuxというOS (VirtualBox, Vagrant, Ubuntuインストール, OS, CUIの大切さ)

コンピューター構成要素 (ノイマンコンピューター, プロセス, lshw, man, ps, dfの使い方)

ファイル操作 (pwd, ls, cd, mkdir, rm, cp, mv, find, ホストマシンとの共有ディレクトリ)

標準出力 (標準入力標準出力標準エラー出力パイプgrep)

vi (vimtutor)

シェルプログラミング (シバン, echo, read, 変数, if)

通信ネットワーク (パケット, tcpdump, IPアドレス, TCP, ルーター, ping)

サーバークライアント (tmux, nc, telnet)

HTTP通信 (http, https, DNS, hostsファイル, ポートフォワーディング)

通信をするボットの開発 (cron, ログ収集)

GitHubウェブサイトの公開 (GitHub, リポジトリ, fork, commit, 情報モラル)

イシュー管理とWikiによるドキュメント作成 (Issues, Wiki)

GitとGitHub連携 (git, ssh, clone, pull)

GitHubへのpush (init, add, status, インデックス, commit, push, tag)

Gitのブランチ (branch, checkout, merge, gh-pages)

ソーシャルコーディング (コンフリクト、プルリクエスト)

Webアプリ基礎コース

Node.js (Node.js, nodebrew, Linux, REPL, コマンドライン引数, プルリク課題)

集計処理を行うプログラム (集計, 人口動態CSV, Stream, for-of, 連想配列Map, map関数)

アルゴリズムの改善 (アルゴリズム, フィボナッチ数列, 再帰, time, プロファイル, nodegrind, O記法, メモ化)

ライブラリ (ライブラリ, パッケージマネージャー, npm)

Slackボット開発 (slack, mention, bot)

HubotとSlackアダプタ (hubot, yo)

モジュール化された処理 CRUD, オブジェクトライフサイクル, filter)

ボットインタフェースとの連携 (モジュールのつなぎ込み, trim, join)

同期I/Oと非同期I/O (同期I/O, 非同期I/O, ブロッキング)

例外処理 (try, catch, finally, throw)

HTTPサーバー (Web, TCPとUDP, Webサーバーの仕組み, Node.jsイベントループ, リスナー)

ログ (ログ, ログレベル)

HTTPのメソッド (メソッド, GET, POST, PUT, DELETE, CRUDとの対応)

HTMLフォーム (フォームの仕組み, form, input)

テンプレートエンジン (テンプレートエンジン, jade)

HerokuWebサービスを公開 (Webサービスの公開, heroku, dyno, toolbelt, login, create, logs)

認証利用者を制限する (認証, Basic認証, Authorizationヘッダ, ステータスコード)

Cookie を使った秘密匿名掲示板 (Cookie, Set-Cookie, expire)

UI、URI、モジュール設計 (モジュール設計, フォームメソッド制限, リダイレクト, 302)

フォームによる投稿機能の実装 (モジュール性, textarea, 303)

認証された投稿の一覧表示機能 (パスワードの平文管理の問題, 404, テンプレートのeach-in)

データベースへの保存機能の実装 (データベース, PostgreSQL, 主キー)

トラッキングCookieの実装 (トラッキング Cookie, IDの偽装, Cookie の削除)

削除機能の実装 (データベースを利用した削除処理, 認可, サーバーサイドでの認可)

管理者機能の実装 (Web サービス管理責任, 管理者機能の重要性)

デザインの改善 (Bootstrap, レスポンシブデザイン, セキュリティの問題があるサイトを公開しない)

脆弱性 (脆弱性, 脆弱性で生まれる損失, 個人情報保護法, OS コマンド・インジェクション)

XSS脆弱性対策 (XSS, 適切なエスケープ処理, リグレッション)

パスワード脆弱性対策(ハッシュ関数, メッセージダイジェスト, 不正アクセス禁止法, パスワードジェネレーター, 辞書攻撃)

セッション固定化攻撃脆弱性対策 (セッション, セッション固定化攻撃, ハッシュ値による正当性チェック)

より強固なセッション管理 (推測しづらいセッション識別子, 秘密鍵)

CSRF脆弱性対策 (CSRF, ワンタイムトークン)

安全なHerokuへの公開 (脆弱性に対する考え方, HTTPの廃止)

Webアプリ応用コース

Webフレームワーク (Express.js, フレームワーク導入, 簡単なAPI, セキュリティアップデート, Cookie パーサー, ミドルウェア, 外部認証, ロガー)

ExpressのAPI (app, Properties, Request, Response, Router)

GitHubを使った外部認証 (Passport, OAuth)

スティングフレームワーク (Mocha, レッド, グリーン, リファクタリング)

継続的インテグレーション (CircleCI)

クライアントフレームワーク (Webpack, Chrome 以外のブラウザでもES6)

DOM操作フレームワーク (jQuery, jQueryアニメーション, this)

AJAX (jQuery.ajax, クロスドメイン, 同一生成元ポリシー, x-requested-by, CORS)

WebSocket (WebSocket, WebSocketの状態遷移, Socket.io)

RDBとSQL (DDL, DCL, CREATE, DROP, INSERT, DELETE, UPDATE, WHERE)

データモデリング (リレーショナルモデル, 正規化)

テーブルの結合 (外部結合, 内部結合, 片側外部結合, JOIN ON)

インデックス (インデックス, 複合インデックス, Bツリー)

集計とソート (SUM, COUNT, ORDER BY, GROUP BY)

「予定調整くん」の設計 (要件定義、用語集、データモデル、URL設計モジュール設計、MVC)

認証とRouterモジュールの実装 (Mocha, supertest, passport-stub, モックテスト)

予定とユーザーの保存 (セキュリティ要件, UUID, 複合主キー)

予定とユーザーの一覧の表示 (非同期処理, Promise, then)

出欠とコメントの表示 (入れ子の連想配列, Promise.all, 子どもからデータを消す)

出欠とコメント更新 (Promiseチェイン, リファクタリング)

予定の編集と削除 (要件の衝突, 関数再利用)

デザインの改善 (this, グローバルオブジェクト)

セキュリティ対策と公開 (X-Frame-Options, Heroku環境変数)

2017-05-31

まず、Web制作Web開発は業界が違う

Web制作会社はもともと広告印刷業界から出てきた人たちで、デザインは得意だがプログラムはムリ

Web開発会社システム開発業界の人たちで、デザインよりプログラムが得意

レスポンシブだUIUXだとお熱を上げてるのはWeb開発会社さんの方

開発屋が静的Webを片手間で請けることもあるが、基本的に50万以下の仕事を請けることは稀

例に出てきたのは制作屋だろうし、その単価としては正直普通

bootstrapで作れって言われても、たぶんスキル不足で無理だろう

http://anond.hatelabo.jp/20170531180401

2017-02-16

http://anond.hatelabo.jp/20170215123151

暇ならばWP+AWSWEBアプリ的なものを作ってみるとか、GitHub.io+Bootstrap+JSフレームワークSPA的なものを作ってみるとか。

俺は在職中で暇がなかったので、Adobe Portfolioを使ったけど。

2016-10-14

Bootstrapの div class="col-md-4" って font color="red" とどう違うの?

表示にの関係するclassって意味と見た目の分離も何もなくね?

classと別のstyleclassみたいな属性があってCSS適用させたいだけならそっち使うみたいにするのが理想

2016-09-19

Webサイト作るのめんどくさい

仕事ポートフォリオサイト作らなきゃいけないんだけど、すっげえめんどい

過去仕事画像を集めるのはフォトショちょちょいと出来るけど、HTMLを書くのがめんどくさい。

Bootstrapテンプレートを探してみたけど、どれもお洒落すぎて日本人きじゃないし。

あーめんどいめんどい

でもブログダサいデザインカスタマイズするのめんどくさい。

2016-06-18

Twitter Bootstrapを使ってる奴に物申す

画像リンクが左右の空白領域にまで広がってる奴。

マジファックだからやめろ。

2016-05-21

http://anond.hatelabo.jp/20160521163144

React.js界隈の人に聞きたい

http://anond.hatelabo.jp/20160521163144

最近某所で、React使うとjQuery不要だ的なタイトル記事を書いちゃた気がするので一応反応しときます。長文ごめんね。

えーととりあえず、あのタイトルは実際のところ省略しすぎであり、もちろん本来は「場合によってはjQuery不要」「jQueryは要らないこともある」と長く書いた方が正確です(本文ではちゃんとReactが万能ではない説明をしてる)。でも多少釣りっぽいタイトルの方が読まれるようなので反省はしていない。

そもそも世の中にそんなにSPAがあるのか

世の中の絶対数は知りませんが、自分脳内ではもう「ページ遷移しない方がずっと楽に開発できてユーザ体験も向上するのに、敢えてそうしない理由がない」という至極単純な話なので、そこは悩むところではないです。ページを複数作り、<input type="hidden">とかセッション変数とか駆使する面倒ごとは、書かないでいいなら二度と書きたくない。

というか、ちゃんと書かれたSPAは使っていてSPAであることにそもそも気づかないので、「SPAから使いづらい」という主張はよく分かりません。GitHubTwitterサイトSPA的なことをしている故に使いづらいでしょうか。偶然タブを開いてたので調べたらそうだったから紹介しますが、例えばWebpackのドキュメントサイトは(Reactではないけど)SPAで、ブラウザMarkdownレンダリングしていますhttp://webpack.github.io/docs/ )。サーバサイドで動くスクリプトタスクゼロ個人的にはこういう使い方で十分嬉しいです。

何にせよReactのメリットが真に活きるのはある程度の規模以上だと思うので、小規模で導入してjQueryより短くならないことは普通にあります自分中の閾値としてはJSコードが数百行超えるならもうReact使う。

JSXを使うことに抵抗ないんですか?

んー、要するに「別物であるDartCoffeeScriptは許すけど、ES6で書く以上はES6外の独自構文を混ぜるのは許さん」という主張だと解釈したのですが、そういうことですか? 正直その主張を聞いたのは初めてです。歴史的JSXとES6は完全に独立して発明されました。最近になってBabelが両方同時に扱えるようになりましたし、Babelはまさにそういう拡張性を重視しているツールです。それは「ああ便利になったね」というだけの話であり、なぜ「ES6とJSXは混ぜるな危険」となるのかよく分かりません。現にこれが最も標準的で人気の組み合わせです。

JSXを使うことへの抵抗」ということなら、とにかく見た目にコレがキモいと感じる人が非常に多いのは事実です。現に、JSXより見た目がキモくないことを売りにしている仮想DOM実装一定の人気を博していたりします。でもそういうライブラリは「キモさ」軽減のために結局新たな構文やら独自コンパイラやらを編み出して柔軟性を犠牲にしていますJSXは「関数呼び出しのシンタックスシュガーJavaScriptに1個導入するだけで問題を概ね解決する」というシンプルかつ一番表現力の高い解決方法だと思います仮想DOM思想に逆らわない最も素直なやり方であり、将来長持ちする気がしています

はい所詮JSXシンタックスシュガーなので、使いたくないなら使わず本来関数スタイル仮想DOMを書いてReactを使ってもいいです。タイプ量が増えて若干見づらくなるだけなんで。

それと、JSXじゃなくてテンプレートでいいじゃん的に思っているようですが、テンプレート仮想DOMでもなければJavaScriptでもないので、速度や機能の面でReactがやっていることに遠く及ばないと思います

5年後のビジョンがありますか?

Reactはもう登場して3年経過して未だに勢いが増していますし、日常で困らないレベルコンポーネント集も揃っています。React-Bootstrapはいいぞ、心が豊かになる。そろそろ採用してもアーリーアダプターとも言えんでしょう。むしろ真に先端を見るのが好きな人に言わせりゃ、2015年なんて「Reactが淡々成熟していくのを見ているだけの、つまらない年だった」みたいな感じらしいですし。

Reactは現時点で既に3年に1回レベルのビッグウェーブであることは疑いようがなく、「これが10年に1回、つまりjQuery以来のビッグウェーブなのかどうか」については、そう信じている人と懐疑的な人がいる、という状況です。私はAngularもCoffeeScriptも「3年に1回」レベルに感じたのでスルーしましたが、Reactには「10年に1回」の方になりうる素質を感じています個人の感想です)。将来もっと凄いものが出るとしたって、それは「ベターjQuery」ではなくて「ベターReact」でしょう。通常は「3年に1回」レベルでも試したり仕事に使ったりして構わないと思いますが、10年に1回の技術でなければ使わない主義の方は、あと2~3年待てばよいと思います

保守性に関して言うと、Reactは典型的な「ひとつの事だけをとても上手くやる」系のライブラリです。考え方のコツさえ掴めば、記憶すべき要素はjQueryやAngularと比べても圧倒的に少なく、むしろそこらのテンプレートエンジンを覚える方が面倒なくらいです。10年後に見ても何をやっていたのか30分で思い出したいというのであれば、むしろAngularとかよりReactを採用すべきだと思います

jQueryからReactに移ろうとしてる自分個人的理由

http://anond.hatelabo.jp/20160521163144

内容から誰が書いてるかわかるかもしれんけど、まぁスルーよろしく。

jQueryもそんなにガッツリ使ってるわけでもないし、Reactはまだリリース前の調査下地作りの段階だけど

正直言ってjQueryに戻るつもりは毛頭ないぐらいReact便利だと思ってる。

でもjQueryを捨て去れるかというとそれも無理だと思ってる。

その辺のことを適当に書いてみる。


用途

社内サポート的なことやってて、サポートテンプレート対応を省力化するために

Webツール作って人が対応するコストを減らすために使ってる。

チーム組んでガッツリ大規模ツール開発ってわけでもない。

jQueryで一つツール作ってリリースしてそこそこ人的コスト削れたのはよかったと思ってる。


jQuery脳内DOMリーとの格闘に疲れ果てた

最大にして一番の理由がこれ。

そんなに大規模なアプリケーション作ってるわけでもないし、関係者も俺一人だけど正直DOMリー脳内でくみ上げるのに疲れた

500行もいかないようなショボいコードでも脳内DOMリーと格闘するのしんどい。

DOMリー触るほうが楽ってみんなどの程度のコードでそんなこと言ってんの?

そんなスーパーハカー揃いなの?信じられないんだけど。


React-Bootstrapかいう神コンポーネント出会った

オリジナルbootstrapはどうしても頭に入ってこなかったし、手を付ける気にもならなかったけど

React-Bootstrapマジで楽だし、スッと理解できる。マジ最高。

Bootstrapってこっちを本筋にすべきじゃね?と割とマジで思ってる。

まだ触って3日も経ってないけど。


ページのほぼすべてがjsに集約できる

これはちゃんとしたWeb界隈の人は利点と思わないのかもしれないけど

一人でいろいろ賄わざるを得ない俺みたいな人間にとってはマジで楽。

ベースHTMLにはベースのdiv一個載せとくだけで後は全部js

レイアウト大元コンポーネントでReact-Bootstrapで組んで、あとは各コンポーネント

個別に作っていけばいい。

HTML見て、CSS見て、JS見て、っていちいち記述方式の違うコードを見る必要がないのは

少なくとも俺にとっては一番楽。


でもjQueryも完全には捨てられない

やっぱまだReactはコンポーネントがそんなに揃ってないんだよね。

からjQueryも使わざるを得ないけど、それも一つのコンポーネントに閉じ込められるから

管理が楽。

極力なくす方向で行くつもりだけど、今はまだ両方使ってる。


JSXは汚くて気持ち悪いけど、コードで書くのはもっといから仕方なく使う

あの気持ち悪いコード考えた人はマジでいい意味でも悪い意味でも頭イカレてると思う。

気持ち悪くて仕方ない。いまだに大嫌い。

でも書くコード減らせて楽なんだよね。だから仕方ない。

どんなに気持ち悪くても、結果が伴う以上使う。


5年後なんて自分の姿すら思い描けないことは考えない

5年後も自分がこの仕事やってるかどうかもわからんからそんなこと気にしたことない。

今ある仕事をなるべく早く簡潔に実行するために最適だと思ってるツールを使ってるだけ。

それがかつてはjQueryだったし、今も一部jQueryだし、大半がReactになろうとしてるだけ。

将来まだこの仕事やってて、もっと有用ツールがあればそっち使う。

別にツールにこだわるつもりは毛頭ないから。

Web界隈の人はもっと真剣考慮すべきかもね。


ちゃんとしたWeb界隈の人のちゃんとした意見も見たい

俺みたいな一人前にすら届いてない奴の意見なんぞ必要ないだろうけど、

自分の今の考えを書いておくと後で見返せるかなと思って適当に書いてみた。

ちゃんとしたWeb界隈の人にとってこの辺の問題ってどんなもんなんだろうね?

みんなも増田ポエム、書こう!

2016-05-15

デザインが全くできない趣味プログラマー、辛い・・・

家でもアプリとかWebサービス作るのが趣味プログラマーだけど、

作ったものデザインが基本糞ダサくなるから本当モチベーション下がる

だってさ、どんだけ最新技術とか詰め込んだって時間つぎ込んで作ったって

アイディア面白かったってデザインダサいクオリティが低いってことじゃない

他の人が作ったサービス見てても法人が作ったサービス

個人プログラマーが作ったサービスって機能性は負けず劣らずでも

「あ、これはデザイナーを雇う金のある法人が作ったサービスだ」

「あ、これはデザイナーを雇う金のない個人が作ったサービスだ」

って直感にわかちゃうよね

こういう感覚って多分リテラシーがかなり低い人達でも割りと瞬時に感じ取ってると思う

最近デザイン用のフレームワークなんてものであるがそんなもの騙し騙し使ってもやっぱりダサいものダサい

たまーに設計からコーディングデザインまで全部一人でやってるっぽいのに

法人顔負けのデザインができてる人も見るけど、本当羨ましい

自分ゲームあんまり作らないけど、ゲーム製作趣味プログラマーなんて

もっともっとこういうデザインできない現象に悩まされてるんじゃないか?って思う

アプリWebサービスよりずっとクオリティデザインが直結して評価されそうだし

ツクール程度ならともかく下手するとデザインできない=作ることさえできない

みたいに技術はあってもスタートラインにすら立てないってことも結構あるんじゃないか

世の趣味プログラマーはこういう悩みをどう解消してるんだろう

BootstrapバリバリWebサービス作るのはもうやだよ・・・

アーカイブ ヘルプ
ログイン ユーザー登録
ようこそ ゲスト さん