小〜中規模サイトのフロントエンド・コーディング規約 CSS・JavaScript編 - Qiita
2021/3/16 初めて記事を書いてから３年以上経過してしまったので、 内容を見直ししました。 関係者が10名以下の小〜中規模案件の開発・保守が多い弊社のCSS・JavaScript規約（にしたい）です。 長くなってしまったコーディング規約もようやく最後です。 ↓関連 環境構成編 HTML編 CSS、JavaScript は数年で書き方が変わってしまうので、 定期的に規約の見直しができると理想ですね。 小〜中規模サイトのフロントエンド・コーディング規約 CSS編 ディレクトリ構成 CSSに関するファイルの一般的な例を示します。 ルート ├ src ... 作業ディレクトリ │ ├ scss │ │ ├ lib ... 外部ライブラリなど │ │ ├ sprite ... spritesmith などで生成したファイル │ │ ├ foundation (base) ... 変数や mix
実装を引き受ける前に詰めておくべきWebフロントエンドの想定漏れチェックシート - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? リキッドレイアウトのように幅が常に変動するレイアウトのデザインは、動かないカンプからは実際の挙動が読み取れず、デザイナーの意図が汲み取りきれないことが多い。また、複雑化するアニメーションの実装においても、カンプだけではコミュニケーションに不備が生まれてしまう。ほかにも、CMSを使った案件ではデザインカンプと実際のデータの間に齟齬がある可能性もある。 実装効率を高めてスケジュール通りに仕事を終わらせるには、とにかく事前に仕様を固めることが大事だ。ワイヤーフレームやデザインの途中の段階からなるべくデザイナーとコミュニケーションを重ね、想定外
JavaScript Clean Coding Best Practices - RisingStack Engineering
Writing clean code is what you must know and do in order to call yourself a professional developer. There is no reasonable excuse for doing anything less than your best. “Even bad code can function. But if the code isn’t clean, it can bring a development organization to its knees.” — Robert C. Martin (Uncle Bob) In this blog post, we will cover general clean coding principles for naming and using
フロントエンドガイドラインについての質問表 - Qiita
この1ページの質問表は、チームで効果的なフロントエンドガイドラインをつくり一貫性とまとまりのあるコードを共に書けるようにする為の補助ツールである。 HTML HTMLの方針 HTMLを書く上でのチームとしての基本方針は何か？ (例： セマンティックなHTML5マークアップを書く, アクセシビリティ, 等。 これらの 資料 を 参照) HTML Tools HTML プリプロセッサーを使用しているか？ (例： HAML, Jade, など) テンプレートエンジンを使用しているか？ (Mustache, Handlebars, など) バックエンドの構成はフロントエンドに影響するか？ (例： WordPress はマークアップのクラスにwp-paginateを加える) もしあれば, そうしたルールをについてさらに説明できるか？ HTML 記述のスタイル スペースかタブか？ コメントルールはどう
textlintで日本語の文章をチェックする
textlintはMarkdownなどテキスト向けのLintツールで、テキスト版ESLintみたいな感じのツールです。 JavaScriptでルールを書けるテキスト/Markdownの校正ツール textlint を作った | Web Scratch 最近azu/JavaScript-Plugin-Architectureという小さな書籍を書いていて、色々簡単に使えるような仕組みを追加しています。 この記事では簡単なtextlintの導入方法について紹介します。 公式サイトには一部ルールを含むオンラインデモが公開されています。 textlint · The pluggable linting tool for text and markdown ドットインストールにてNode.jsのインストール、textlintの利用方法、エディタとの連携などのチュートリアルが公開されています。Node.
Checklist for your new Open Source JavaScript Project
In this post, I’ll synthesize the lessons passed by Kent C. Dodds in his series “How to Write an Open Source JavaScript Library”. Check his course on egghead.io. After watching that (excellent) course, you can use this checklist to quickly refresh your mind and remember each step that you need to do in order to create your next open source project. Checklist Prefer to write a micro-library. Benefi
JSCS: JavaScript Code Style checker
Selling a structured settlement can be a complicated process, but it’s well worth the effort. If you’re looking for a way to get cash quickly, selling your structured settlement is the best option. In this article, we will discuss the process of selling a structured settlement and provide you with all the information you need to make an informed decision. What is a structured settlement? A structu
11の項目を設定するだけでJavaScriptコーディングガイドラインが作成できるjsCode | バシャログ。
ゴールデンウィーク中に5年ぶりにフットサルをしてまだ筋肉痛が癒えてないishidaです。社内でフットサル部を立ち上げてみましたが、参加人数が少ないので横浜近辺で一緒に球蹴りしてくれる人を募集中です。 さて今回は、JavaScriptのコーディングガイドラインを作成してくれるサービスのご紹介です。 JavaScript は HTMLやCSSよりも自由度が高いので、 ガイドライン化してコードを統一するのも手間がかかるかと思います。 また初めてガイドラインを作成する人にとっては、 JavaScriptのどこまでをルール化すればいいのかも悩む部分ではないでしょうか。 そんな時にお手軽でJavaScriptコーディングガイドラインを作成してくれるサービスがありました。 11の項目を設定するだけでJavaScriptコーディングガイドラインが作成できる jsCode http://jscode.org
JavaScriptコーダー必見！クールなJsDoc用テンプレート「JsDoc2-Template-Bootstrap」 | DOTAPON Blog
JavaScriptで大規模開発をされているみなさま、ドキュメントジェネレータは活用してますか？ ソースコードにコメントを入れておくと、自動でHTMLに仕上げてくれるアレのことです。 /** * 足し算した結果を取得します。 * * @param {Number} num1 * 足される数 * @param {Number} num2 * 足す数 * @return {Number} * 結果 */ function add(num1, num2) { return num1 + num2; } JavaScript向けのツールで有名なのが「JsDoc」。 そのまま使うと無難なデザインのHTMLが出来上がってしまいますが、テンプレート機能を使って自由に拡張できます。 そこで今日ご紹介するのが…！ JsDoc2-Template-Bootstrap いかがでしょう、Twitter Bo
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Fractal
Mobile Web App Checklist | Luster
hanatoweb.jp
Creator Job転職お役立ち情報