「sass」を含む日記 RSS

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

2019-06-28

教えてエンジニア

sassの@importみたいに複数jsファイルをただ結合する方法って無い?

gulpfile.jsとかで結合する方法はすぐ見つかるんだけどそういうのじゃなくて、コンパイル前のjs側で管理したい。

レガシーJsからモジュール化とかそういう話ではない。

index.js

├import(_a.js);

├import(_b.js);

└import(_c.js);

って書くとindex.jsにa〜c.jsの内容がそのまま入ってくるイメージ

2018-08-20

作ったものを公開できない問題

こんなのあったらおもろいなーと思ってwebアプリ?みたいなやつ作ってたんだけど全然公開できない。

【公開までの見積もり甘すぎ問題

8割はできたって所から公開しようって状態まで持っていくの大変すぎ。

感覚的には8割から先がそれまでの2倍の負担はある。

デザインめんどくさすぎ問題

デザインなんてどうでもいーと思いつつも触りだしたら「せっかくだから」と触り出しちゃう

さすがに最低限それっぽくしたくなっちゃう。

CSSフレームワーク使ってみたら結局上書きしまくりで使い物にならない。

もうさ、本当になんでもいいんだよ。レスポンシブとかどうでもいいんだよ。

けどそれくらい対応してないとダサいみたいな空気感ちゃう

なんでsassの使い方なんて調べてるんやー

compassってなんや

lessってどうなったんやー

サーバー準備めんどくさすぎ問題

どのサーバーを使えばいいかわからん

VPSherokuAWS

こんなものを公開するのにサーバー代を払う事を想像すると手がすくむ。

AWSは便利みたいな風潮なんなの普通に構築大変なんだけど。何のサービスあるかよく分からないし。高いし。

heroku操作がないと止まるらしいし。

操作ってなに?デプロイWEBアクセスでもいいの?定期的にリクエスト投げておけば止まらない?

cloneとか使えるの?nginxの設定いじったりとかできる?apache

使ったこと無くてわからない。

得体が知れなくて怖い。

結局VPS借りたよもう!

【話が大きくなっていく問題

最初は1つの機能だったのが深夜のテンションであれしたいこれしたいってどんどん出てくる。

超人サービスになって超有名人になってインタビューに答える姿まで想像ちゃう

ブツブツ独り言言いながら予行練習もしてる。

最低限作る機能がどんどん増えていく。

【みんなに知ってもらえない問題

ある程度有名人ならTwitterとかでつぶやくだけで認知してもらえるだろうけどさ。

全く有名でもない自分が、作りました〜って言って誰が見てくれるのさ。

最初の広めるハードル高すぎない?

意外と誰かが見つけてくれるものなの?

白馬王子様を待っていればいいの?

お金払えばいいの?誰に払えばいい?

作ってる時は超人サービスになる事を想像してムフムフやってたけど、いざ公開しようという段階まで来ると「どうせ誰にも見てくれない」とか考えてどんどん自信がなくなってゆく。

カッコいい事言ってるけど、作ったサービスが全くウケなくて誰にも使われなかったら..とか、失敗した自分想像して動けなくなってるんだと思う。

あーーー寝る前にスマホで1時間掛けて書いた。

何を書きたいのかもよく分からなくなってきた。

書くってこんなに時間かかる?

自分だけ?

文章書くの大変すぎ問題...

もういい!寝る!

のび太さんのエッチ

2018-08-09

xyzzy 使いに 50 の質問

01. ハンドルネームは?

  増田

02. ご職業、年齢はいくつですか?

  なんでも屋さん、アラサー

03. xyzzyについて何かwebサイトを持っていますか?

  持っていません

04. 現在使用中の xyzzyバージョンは何ですか?

 0.2.2.253

05. xyzzy 使用暦はどれくらいですか?

  15年くらい

06. xyzzy を使うようになったきっかけは何ですか?

  昔のことすぎて忘れましたが、学校UNIX 演習で Emacs を使っていたので、Windows でも使おうと思っていて見つけたんだと思います

07. xyzzy 以外に使っているテキストエディタはありますか?

  Atom, McEditor

08. xyzzy を使う前に Emacs 系のテキストエディタを使ったことはありますか?

  はい

09. xyzzy を主に何に利用していますか?

  プログラムを書いたり設定ファイルをいじったり、テキストに関することならだいたい

10. xyzzy が関連付けされているファイルタイプは何ですか?

  txt, md, log, ini, bat, html, xml, css, less, scss, sass, styl, js, coffee, pl, php, py, rb, java, sqlかにもあるかも

11. xyzzy他人に勧めたことはありますか? また、結果はどうでしたか?

  使い始めた当時同級生が何人か使っていました

12. xyzzyフリーじゃなかったとしたらいくら位の値段になると思いますか?

  今なら3000円くらいなら買う

13. xyzzy を何と呼んでいますか?

  じじー

14. xyzzy の好きな点・嫌いな点はどこですか?

  好きな点:動作をほぼ自在カスタマイズできる点

  嫌いな点:動作カスタマイズするとき不自由なところがある点

15. パソコンを立ち上げている時間の内、xyzzy をどのくらい使っていますか?

  業務ときは3割くらい?

16. キーバインドWindows風ですか? Emacs風ですか? オリジナルですか?

  Emacs

17. .xyzzyに書く派ですか? .siteinitに書く派ですか?

  必要に応じてそれぞれに

18. 拡張Lispバイトコンパイルしますか?

  してます

19. セレクションリージョン、どちらを多く使いますか?

  リージョン

20. xyzzy を使っていて挫折したことはありますか?

  はじめのころ五目並べになかなか勝てなくて挫折しました

21. xyzzy の使い方をどうやって学びましたか?

  実際にさわりながら。LispGoogle 先生さまさま

22. xyzzy を使うにあたって一番苦労したことは何ですか?

  xyzzy 自体Lisp APIマニュアル化されていないところ

23. xyzzy を使って目からウロコだった機能は何ですか?

  Buffer Menu

24. 今の xyzzy に望むことはありますか? またそれは何ですか?

  矩形機能に影響が出そうだけどプロポーショナルフォントへの対応と、絵文字など最近 Unicode に追加された文字への対応

25. Lisp はある程度読み書きできますか?

  xyzzy自分の使いやすいようにできる程度には

26. Lisp のほかに読み書きできるプログラム言語はありますか?

  JavaScript, ES 2016, Coffee Script, Action Script 3, C, C++のごく一部, Objective-C, Rust, Swift, Perl, PHP, Python, Ruby, bash, xyzzy lisp

27. 自分で作った 拡張Lisp を公開していますか?

  GitHubGist にあるので探してください

28. 拡張Lisp で導入しているものは何ですか? (多い方は代表的ものをお答えください)

  clickable-uri, jscript-mode, markdown-mode など

29. これは外せない! という 拡張Lisp はありますか? またそれは何ですか?

  いろいろやるので今ある拡張機能がないと無理

30. NetInstaller を利用していますか?

  はい

31. 拡張DLL を導入していますか? またそれは何ですか?

  popup-dododo のための Cairo とか?

32. ドキュメント(info,reference等) は使っていますか? また、それは何ですか?

  使っていません。自分で改造してキーワードを全部 Web検索するようにしています

33. ネット関係拡張Lisp(www-mode,kamail等)を使っていますか?

  xyttr

34. アウトライン系のLispは使っていますか? またそれは何ですか?

  使っていません

35. メモ系(changelog-memo,howm等)Lispは使っていますか? またそれは何ですか?

  使っていません

36. xyzzy五目並べはやったことがありますか? また、結果はどうでしたか?

  今なら結構勝てます

37. キーボードマクロは使いますか?

  たまに。テキストの整形処理なら正規表現ゴリゴリやるほうが多いです

38. 辞書機能は使いますか?

  使っていません。国語英和・和英、英英辞典iPhoneアプリを使います

39. xyzzy のファイラは使いますか?

  毎日仕事に欠かせません。便利にカスタマイズしすぎてむしろファイラだけのために新しく xyzzy 自体を起動することもあります

40. フレームは使いますか?

  あまり使いません。新しく(Windows における)ウィンドウ

41. セッションは使いますか?

  使っていません

42. メーリングリストには参加していますか? また、メール送信したことはありますか?

  ありません

43. 2chxyzzy 関連スレッド書き込みしたことはありますか? また、その頻度はどのらいですか?

  大昔にどうしてもわからないことがあって書き込んだ記憶があります

44. xyzzywikiに書き込みしたことはありますか? また、その頻度はどのくらいですか?

  拡張機能実装に関してちょろっと書き込んだ記憶があります

45. xyzzyメニューは表示していますか?

  たまにほしくなるので表示しています

46. xyzzyツールバーは表示していますか?

  隠しています

47. xyzzyファンクションバーは表示していますか?

  表示していません

48. xyzzyバッファバーは表示していますか?

  表示していません

49. 色、フォントなどは変更していますか? またそれは何ですか?

  色は暗い背景色ハイライトカラーはできるだけ色相を離したパステルカラーです。

  フォントConsolas に源新ゴシック Regular を組み合わせています

50. 最後に、一言お願いします。

  まだまだ xyzzy は不滅です

2018-06-26

anond:20180626091249

他社がらみの場合は、ちょっと教育するのきつい。

jpegしか知らないWebデザイナは他社の人間だし。

まあ「要望」という事で、技術的な情報は共有していってるつもりだけども。

TypeScriptで作ったプロジェクトを、部分的に他社に引き継ぐにも

tsよく分からないんでjs直接いじっちゃいました」とか笑いながら言って来るし。

SASSだと言ってるのにCSS直接いじってヘラヘラ笑ってるし。

無能が金ばっか要求してくる。

2017-12-07

https://anond.hatelabo.jp/20171204113430

サーバセットアップからアップデートチューニング

まあやれる

SIerでもWin鯖の面倒みたりするじゃんね

CSS,JavaScript,HTML5,PHP,Ruby,node.js,SASS,LESS,

サーバサイドは主にPHPまれC#だが、フロントは一通り

スマホネイティブ開発もやるかな

SIerだとJava,C#,VBJSか?

Photoshop画像処理AIデザインカンプ

デザインはデザイナがやるからエンジニアクリッピングと縮尺操作程度じゃない?

SIerだとデザイン行程が無いけど、エンジニアはあまり関係が無い気がする

要件定義から動作テストマニュアル作成まで

やります

SIerでもやるじゃん

なるほど、SIerだと、一つの現場で全部やる人は居ないね

ただ長い人なら、どれも経験あるんじゃないの?

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-08-14

web系の専門用語多すぎ問題

門外漢からするとこんな風に聞こえてる。(所々適当に書いてるし書いてる内容は嘘デタラメ

「gulpでbowerしてsassgruntビルドすれば、cssストリーミング形式でデタッチされるから便利だよ。それにgulpはCoffeScriptとかtypescriptみたいな流行りのサードパーティも従来のJSみたいに変換してくれるしウォータフォールじゃなくてアジャイル的なプロジェクトでも使いやすい。スクラッチから書かなくてもいい感じにアジャストしてくれるよ。あと、OSSとしてgit上に上がってるんだけど、DLなんかもAWS連携させてWebGLTensorflowやらchainerやらと組み合わせればブラウザDQNとかA3CとかDCGANも動かせるスクリプトリリースされてた、バックエンドではDNNを走らせてフロントで表示する分をNode.jsカスタマイズしたりタスクランナープロセスマネージメントできるからもはやjstensorflowを含めたpythonラッパーみたいな感じで使えて便利。最近ではbluemixがBitcoinマインングをサポートしていてブラウザ上でウォレットからマイニングセットアップまでできるんだってブロックチェーンの仕組みを拡張して社内のタスクマネージャーとかNAS上のデータ分散してサーバーに保存できるみたいなこともあるんだって。」

どうしてweb系は専門用語肥大化するんだ。

2016-07-31

webサイト作成したいだけなのに何でファイルを沢山作らないといけないのか

webpackの設定ファイル

gulpの設定ファイル

sass設定ファイル

ライブラリを使うとどんどんファイルが増えていく

設定に関する仕様策定して統一できないものかね

設定ファイルを1つにまとめられたら良いんだけどね

↓こんな感じで1ファイルカテゴリ毎に設定したほうがディレクトリがきれい

[webpack]

[gulp]

[composer]

[phpmd]

2016-04-18

プログラマーちょっと来い、神アイディア思いついたから作ってくれ

完全に単一HTMLファイルで動作するMarkdownエディタ作った

http://qiita.com/tatesuke/items/225b51b270faf8b10923

Qiitaのこの記事見てて思ったんだけどさぁ、

これ絶対単一HTMLじゃなくてAtomプラグインで作るべきだって思ったんだよね

使ってみた感じやっぱ更新→保存周りが弱いんだよね、発想は良いんだけど

あとその他のMarkdownエディタに比べてデザインあんまかっこよくない

エディタ部分とかほぼ単純なtextareaだし

例えばhogehoge.md.htmlみたいな名前ファイルatomで読みこめば.mdファイルみたいな

感じ(実際はscriptとかCSSかいろいろ書かれてるわけだけどMarkdown部分のみ)で読み込まれて、

で、それを編集した奴をそのままブラウザで開いたらJS側でレンダリングされたドキュメントとして表示される感じ

簡単にSassスタイルを当てたりリアルタイムプレビューできればなお良い

実質完全に単一ファイルだしエディタ部分をAtomパワーに依存させることができるから

ええ感じのアイディアと思うんだけどどうやろか

2016-03-28

http://www.slideshare.net/KenyaKodaira/2016-59970832

なんかたくさんブクマされてますが、読む必要ないと思います

p.4
  • HTML Template Engin`d`ってなんですかね。誤字脱字チェックはしましょうね。
  • gulpのgは小文字なのでよろしくです。
p.5
p.6
p.8
  • EditorCodingってなに
p.9
  • コードブロックが見づらいっす。黒バックにblueて誰が読めるのだろうか。若者か。
  • npm install後に急にgulpって書いてあるけど、それは何をするタスクなのです?
    • まぁ、この後gulpタスクについて出てるんでしょう……
      • 出てこなかった
p.10
p.15
p.16
p.18

コード品質が維持される場合に限り、難読化、最小化、コンパイルするのは自由です

  • HTMLの話ですよね? コード品質が維持されない難読化や最小化やコンパイルってなんだろう。
  • あとに出てくるけど、CSSには容量削減を異常に求めすぎてるわりには、HTMLには無関心な感じがするんですよね。
p.19

a、span、imgなどの最小の位置にでは開業は適宜対応

  • その適宜が人によってブレるから、それを潰すのが「フォーマット」だと思うんすよね。
  • いっそ「新しい要素が出現したら必ず改行する」くらい言ってほしい。
  • あと日本語が変なんで、それも。
p.20
p.21、22
p.2324
  • .editorconfigにどう書けばいいかをだな……。
p.25
  • HTMLルールだとしたら、そういう開発の都合のコメントを残して納品するのはお行儀が良くないっすね。
  • Jadeを使う前提のようだし、Jadeコメントでの話をしてるなら別にいいんすけどね。
  • でもさっきからJadeのサンプルが全く出てこないからオッサン不安になってきちゃったっす。
p.26

正しいHTML

  • HTMLの正しさとは?
  • 参考リンクから察するに、invalidでなければいいと思ってるなんてことはないっすよね。
p.27、28
p.29、30
p.31
p.32
p.36、37
p.40

CSS教科書

p.42、43
p.44、45
p.49、50
p.57、58
  • HEXの短縮は規定しなくていいと思います
  • ビルドをかける前に勝手に置換されるような仕組みを入れるべきところかと。
  • gulpでできますし、ググれば出てきます
  • ちなみに、#f00よりもredの方が1バイト少ないんですよ。
  • 容量削減は人が思いつきでやるには不十分なのです。
  • そんなのはビルド時に機械がやればいい。
  • 容量の削減を理由に人の行為制限をかけるのが愚かな行為だと気付いてくれたらうれしいっす。
p.61、62
p.63、64
p.71
p.72、73
  • FLOCSSとMindBEMding共存させるなら、書くべきことが足りなすぎませんか。
p.73

block__element__elementは使用しない

p.78、79
p.80、81
p.87

GoogleChromeなら変換時に右側にマーク

p.96
p.98

svgにすることで1つの画像でまかなえる場合svg使用する

p.102
  • ここまで4回くらい読みなおしたんですけが、どうにも上澄みだけの理解しかしてないように感じるんですよね。
  • Jadeについては何かルールは設けないのでしょうか。
  • JavaScriptについては……?
  • そのほかにも、ライティング自体が下手すぎて、これを人に見せるのはどうなのっていう感じがしちゃいました。
  • 誤字脱字くらいはちゃんとチェックしたほうがいいでしょうね。
  • 結論:いろいろ惜しいけど、よくなる余地はたくさんあるので、がんばってください。

2015-12-21

SCSS(Sass)とLESSってどっちがいいの!?

Web製作者のタマゴなんだけどSass使ってないとか信じられないってセミナーでよく言われるんだけど!

Sass便利そうだから使ってみようかなって思うんだけどLESSっていうのもあるらしい。

どっちがスマートなの!?

ナウいのはどっち!?

結果にコミットしてくれる方は!?

実務性、将来性、設計思想の3つで評価して!!!!!!

2015-01-22

Webサービスよく作るんだけどデザインセンスがなさすぎるからどうしよう

何回アイディア考えて新しいWebサービスを作ったとしてもデザインセンスが向上する兆しが全く見えない。

色彩検定取ったりUIデザイン入門書読んだりSassだの色々なCSSフレームワークだの勉強してみたけどやっぱり根本的にダサい人間が作るものは付け焼き刃な知識程度じゃ覆しようがないのかまあとにかくダサい

出落ちみたいな奴ならともかく数百時間とかかけて作ったサービスがあんまりにも野暮ったいデザインだと見ていてこっちが悲しくなってしまう。

デザイナーさんって藤原竜也ツール程度のサイトでもスタイリッシュに作れたりするんだろうか。

デザイナー友達作って今度何か作るときダメ出しして貰おう。。。

2014-12-24

イブクリスマスも予定のない俺とみんなのためのエロサイトを作った

作ったサイト

エロ動画を色々なところから収集するサイトです。

skrsvideo

http://skrsv.info/

サーバー選び

今回プログラミング言語Rubyを選択したため、基本的にはVPSクラウド的なサーバーLinuxが動作する環境を探しました。

エロサイト運営するにあたって問題になるのがサーバー選びです。

基本的日本レンタルサーバーではアダルトサイト運用を禁止しています

普段使っているさくらVPSが利用できず、AWSもなんだかグレーな感じ(東京リージョン以外なら・・・?)

そんなわけで探し、GMOグループWebkeepersを使いました。

Webkeepersのサーバー海外にあるらしいです。

質問アダルトサイト運用はできますか?

http://faq.webk.net/faq/index.php?qc=1&qc_sub=4&id=99

使っても良いよ〜というお墨付き

そして価格も手頃だったためここに決定。

システム

DBMariaDB
WebサーバNginx
フレームワークRuby on Rails

MariaDBを選んだ理由はなんとなく、MySQLとの違いはほぼありません。利用するGEMmysql2でいけます

NginxWebサーバで、ページキャッシュもしています

ちなみにJavaScriptは使わずすべてCSSで作る方針しました。

スマホPC対応のためにMedia Queryでレスポンシブにしています

Webの流れ

Nginx

unicorn

Ruby on Rails

MariaDB

という流れです

使っているGEM

gem 'mysql2'

gem 'rails_config'

gem 'kaminari'

gem 'haml-rails'

gem 'sass-rails'

gem 'nokogiri'

gem 'unicorn'

フロントhamlsassで、難しいことはしていないのでcompassはいれませんでした。

あとはデバッグ用にrails_config、pry系が入っています

クローリングスクレイピングでnokogiriを使います

クローラー

skrsvideoでは動画URLを取得するためにクローラーもどきスケジューリングして収集しています

スケジューリングにはcrontabを使用しています

crontabでRakeタスクを定期的に叩きます

コマンドはこんな感じ

RAILS_ENV=production bundle exec rake item:search


Rakeタスクはnokogiriでxvideosへのリンクを集めています

doc = Nokogiri::XML( open(URI.parse(url)).read )

urls = []

doc.css('a').each do |link|

 urls.push link[:href] if link[:href] =~ /xvideos.com\/video(\d+)/

end

Nokogiriのスクレイピングでaタグリンクを取得し、URLxvideosのものかチェックして保存って感じです。

動画を探し終えるとaタグからランダムピックアップし次のページに進んでいきます

動画が見つかったページはドメインDBに記録して、しばらくしたら再びクローリングをするようにし、収集効率化。

サイト機能

(45 min)←コレの安心感は異常wwwwww

http://blog.livedoor.jp/dennououjo/archives/39873075.html

これを思い出して、動画時間を表示するようにしました。

30分以上の表示はちょっと頑張ったところ

http://skrsv.info/30_min_more


AV女優タグが表示されるようになっています

これはタイトル文字列から部分一致で引っかかったものを表示しています

AV女優名前を表示するためにWikipediaからとってきたら、ちょっと膨大な数になってしまったため断念。

どんだけ女優いるんだって感じですね。

DMMランキングに載っていた方だけをとりあえず入れています

タグも同様にDMMから

おわりに

1日でつくろうと思っていたら思った以上にサーバーが見つからないで、サーバー選びに1日かかってしまいました。

あとはFC2とか対応できたらいいなーと思います

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