2021年のファビコンを極める: 本当に必要なファイルはほぼ6つ（翻訳）｜TechRacho（テックラッチョ）〜エンジニアの「？」を「！」に〜｜BPS株式会社

2021/06/24 25 users Autoprefixer ファビコン TechRacho

概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: How to Favicon in 2021: Six files that fit most needs — Martian Chronicles, Evil Martians’ team blog 原文公開日: 2020/12/23 原著者: Andrey Sitnik — PostCSSとAutoprefixerの作者、Evil Martiansのリードフロントエンド開発者 サイト: Evil Martians ... 続きを読む

Flow/PostCSS の大規模プロジェクトを TypeScript/emotion に移行して数万行のプルリクを投げた話 - JX通信社エンジニアブログ

2020/06/04 11 users Emotion TypeScript Flow プルリク

JX通信社CDOの小笠原(@yamitzky)です。 AI 緊急情報サービスの「FASTALERT」は、報道機関や公共機関に導入いただいている(お堅めな) BtoB SaaS でありながら、 事業開始当初から React を使った Single Page Application(SPA) として作っています。 2017年には、より信頼性のあるフロントエンドを提供するため、 Faceboo... 続きを読む

AbemaTVにおけるCSS is too fragile問題に対する解 / Solution of "CSS is too fragile" by AbemaTV - Speaker Deck

2019/05/18 66 users AbemaTV リファクタリング by AbemaTV 構成

AbemaTVにおけるCSS is too fragile問題に対する解 / Solution of "CSS is too fragile" by AbemaTV リファクタリングをしていたらCSS Modulesを使っていたにも関わらずCSSが壊れてしまった私達は、CSS ModulesがCSSの特性・我々のプロダクトの構成や開発方針に合わないと判断し「BEMベースのクラス名設計 + PostCSS」へ... 続きを読む

AbemaTVにおけるCSS is too fragile問題に対する解 / Solution of "CSS is too fragile" in AbemaTV - Speaker Deck

2019/05/18 66 users AbemaTV リファクタリング Speaker Deck

AbemaTVにおけるCSS is too fragile問題に対する解 / Solution of "CSS is too fragile" in AbemaTV リファクタリングをしていたらCSS Modulesを使っていたにも関わらずCSSが壊れてしまった私達は、CSS ModulesがCSSの特性・我々のプロダクトの構成や開発方針に合わないと判断し「BEMベースのクラス名設計 + PostCSS」へ... 続きを読む

[CSS]レスポンシブ対応、フォントに適切なサイズをビューポートに基づいて自動計算して適用するスタイルシート | コリス

2019/02/18 91 users ビューポート コリス RFS プリプロセッサ Stylus

フォントに適切なサイズをブラウザのビューポートのサイズに基づいて、自動的に計算して適用するスタイルシート「RFS（Responsive Font Size）」を紹介します。 Sass, Less, Stylus, PostCSSなどのプリプロセッサやポストプロセッサ対応です。 RFS(Responsive Font Size) -GitHub RFS(Responsive Font Size)の特徴 RFS(R... 続きを読む

QiitaのCSS構成2017 - Qiita

2017/12/27 156 users Qiita Sass CSS 去年 構成

この投稿は Increments Advent Calendar 2017 の18日の記事です。去年に続き、2017年の Qiita の CSS 構成について述べます。 2016年版はこちら: QiitaのCSS構成2016 プリプロセッサー 2016年は CSS のビルドフローで一貫して PostCSS を使っていましたが、2017年では プリプロセッサーとして Sass (node-sass)... 続きを読む

Cacooの次期エディターでWebpackのビルドを6倍早くした話-Wepackビルドパフォーマンス改善ガイド | ヌーラボ

2017/12/20 53 users Webpack RIOT Cacoo TypeScript

こんにちは。みなさまが Cacoo で図の編集をする エディター を開発している、Cacooチームの国広です。Cacooチームでは、エディター部分のビルドに  Webpack  を使用しています。ビルド対象は TypeScript 、JavaScript、 PostCSS 、 Riot （のtagファイル）、画像等です。 そのままビルドするには少し我慢ならない程度に待たされるようになったので、 W... 続きを読む

PostCSSの仕組み - Qiita

2016/12/02 13 users Qiita

// parse.js const fs = require ( 'fs' ) const util = require ( 'util' ) const postcss = require ( 'postcss' ) const css = fs . readFileSync ( './input.css' ) const ast = postcss . parse ( css ) consol... 続きを読む

社内でCSSの新しい方針について話したメモ - Qiita

2016/08/18 141 users Qiita cssnext CSS CSS Modules

社内で新しいドメインを設立するにあたり、 CSS Modules, PostCSS, cssnext を試してみました。 このスライドは、その際の説明に使ったものです。せっかくなので公開します。 「プロトタイプ作成で試してみたけど、みなさんどう思いますか？」くらいの温度感。本番採用が確定したわけではありません。何かお役に立つことがアレば幸いです。 以後、説明に使ったスライド。 おしながき 1. コ... 続きを読む

JavaScriptを劇的に教えやすくするWebサーバ作りました - Qiita

2016/07/16 433 users Qiita rollup Babel Sass Gulp

近年、JavaScriptでコードを書こうとすると、お膳立て7割、コード書き3割みたいな事態がざらにあります。「お膳立て」の例としては、Gulp, Babel, Sass, PostCSS, WebPack, Rollup, Browserifyほか数限りなく。 たしかに、一旦フロントエンド開発に慣れてしまえば、お膳立てにかける時間は短縮することが可能です。でも、これを初学者に強いるのはツラすぎる... 続きを読む

スタイルガイド導入してみた - sekaie engineers' blog

2015/12/22 22 users sekaie engineers Blog スタイルガイド

2015 - 12 - 22 スタイルガイド導入してみた 最近さえりさんという方の 綾野剛 の妄想ツイにはまってます。まいど富坂です。 twitter.com 本日はセカイエ アドベントカレンダー 22日目の記事です。 qiita.com 前回、 sekaie.hatenablog.com ということで今回はPostCSS導入して更にスタイルガイドジェネレーター導入してみました。 スタイルガイドと... 続きを読む

PostCSSさわってみた - sekaie engineers' blog

2015/12/01 19 users Stylus デファクトスタンダード Sass less 富坂

2015-12-01 PostCSSさわってみた セカイエブログをご覧のみなさまこんにちは。 Webフロントエンド担当の富坂です。 今日はセカイエアドベントカレンダー1日目ということで PostCSSについて少し書いていきます。 最近ではもう当たり前のようにSassやLess、StylusなどのaltCSSを使った開発がデファクトスタンダードになってます。 最近ではちらほら聞こえ始めた「PostC... 続きを読む

PostCSSとcssnextで最新CSS仕様を先取り！ | HTML5Experts.jp

2015/09/28 162 users Autoprefixer cssnext Inc スライド

どうも、Kaizen Plarform, Inc.の@t32kです。今日はPostCSSについて解説しようと思います。PostCSSについてはそれを解説した同僚のスライドも素晴らしいので、そちらも参考にしてもらえば幸いです。PostCSS とは何か // Speaker DeckPostCSSとはなにか？PostCSSは、Autoprefixerの作者でも有名なロシアのAndrey Sitnik氏... 続きを読む

PostCSS とは何か // Speaker Deck

2015/08/22 136 users Speaker Deck

関西フロントエンドUG 主催の「Grand-Frontend-Osaka 2015 Summer (http://kfug.github.io/events/2015/grandfrontendosaka/ )」で発表した内容です。 続きを読む

PostCSSとは何か - morishitter blog

2015/08/03 136 users プラグイ GitHub morishitter blog

2015-08-03 PostCSSとは何か PostCSSというnode.js製のツールがある。 PostCSSのGitHubでのStar数は4000を超え、海外のブログではPostCSSについての記事をよく目にするようになった。しかしまだ日本では盛り上がりを感じていないので、日本語のPostCSSの記事を書くことにした。 PostCSS PostCSSとは、JavaScriptで書いたプラグイ... 続きを読む

cssnextでみる次世代CSSとPostCSS | Yucchiy's blog

2015/04/22 85 users cssnext Stylus Sass ウェブデザイン 主流

22 April, 2015 cssnextでみる次世代CSSとPostCSS 今日ではSassやStylusなどaltCSSを用いたウェブデザインは主流になりつつあるが, 一方で, 次世代CSSではaltCSSで実装されているような様々な機能追加が検討されている. そこで次世代CSSを先取りするcssnextと次世代CSSで足りない機能をPostCSSのプラグインを用いて補う方法について紹介する... 続きを読む

CSSのプリプロセスとポストプロセス、そしてReworkとPostCSS - morishitter blog

2014/12/06 62 users rework CSSプリプロセッサー CSSプリプロセッサ

2014-12-07 CSSのプリプロセスとポストプロセス、そしてReworkとPostCSS この投稿はFrontrend Advent Calendar 2014の7日目の記事です。 CSSプリプロセッサーとポストプロセッサー、そしてそれらをビルドするツールであるReworkとPostCSSについて。 CSSプリプロセッサー、ポストプロセッサー まずは用語の定義を確認する。CSSプリプロセッサ... 続きを読む