フロントエンド開発環境スタートセット2024秋 - トレタ開発者ブログ
こんにちは、トレタ VPoEの北川です。 今回は弊社でフロントエンドアプリケーションを新しく構築する際の開発環境として、何のライブラリを入れるかという開発環境初期セットを紹介しようと思います。 Web Framework / CSS Framework / Tesing Framework / Linter / Formatter、それぞれ定番で使うデファクトが大体ありましたが、近年では新しいライブラリも登場したので、2024年現在・最新版を、今回は直近で作られた実際のリポジトリを例にご紹介します。 今回紹介するリポジトリのアプリケーションはtoB向けの管理画面のアプリケーションで、特質した部分も特にない一般的なWebアプリケーションです。 それでは早速、package.jsonの内容はを見ていきましょう。 "dependencies": { "next": "14.2.13", "rea
Token CSS
Token CSS is a work-in-progress. Bugs, missing features, and breaking changes are expected! Token CSS is a new tool that seamlessly integrates Design Tokens into your development workflow. Conceptually, it is inspired by tools like Tailwind, Styled System, and many CSS-in-JS libraries that provide tokenized constraints for your styles—but there's one big difference. Token CSS embraces .css files a
高速で開発者体験も抜群！JavaScriptフレームワークの新星「Svelte」とは何か？
はじめに 本記事では、ユーザーインターフェイスを構築するためのJavaScriptフレームワークのひとつ「Svelte（スベルト）」についてご紹介します。 Webフロントエンドの領域は年々大きくなっており、読者の皆さまの中でもReactやVueといったフレームワークを使ったことがある方が多いものと思います。もしかしたら、Svelteの名前もどこかでご覧になり、気になっている方もいるかもしれません。 Svelteは、そのアプローチの新しさから注目されはじめています。 JavaScript のライブラリに関する大規模調査「State of JS 2020」で「最も愛されているWebフレームワーク」「もっとも開発者の満足度の高いフレームワーク」に選ばれたことでも話題となりました。 そこで本記事では、ReactやVueに少しでも触れたことがある方を想定して、それらと比較する形で、Svelteの特徴
ReactベースのあたらしいフレームワークRemixをためしてみた | DevelopersIO
OSSとしてリリースされたばかりのReactベースのフルスタックWebフレームワークであるRemixをためしてみました。 はじめに こんにちは、CX事業本部MAD事業部の森茂です。 re:Inventを前にAWSの情報も気になるところですが、フロントエンド界隈もReact Conf 2021を前にReact v18 betaをはじめ、Next.js v12やReact Router v6、新しいRoutingライブラリReact Locationのリリースなどなど注目のリリースラッシュが続いているようです。そんな中Reactをベースにした新しいフレームワークであるRemixが本日（2021/11/23日本時間）リリースされました。 Remixとは RemixはReactRouterの作者でもあるMichael Jackson氏（@mjackson）とRyan Florence氏（@ryan
無料で使えるかわいい8bitデザインのファミコン風CSSフレームワーク「NES.css」
ファミコン風デザインのウェブサイトを簡単に作れる無料CSSフレームワークが「NES.css」です。NES.cssはさくらインターネットのダーシノ氏が開発を行っており、ボタンや入力フォームといった基本的な要素から、SNSやキャラクターのアイコンまで用意されています。 NES.css - NES-style CSS Framework https://nostalgic-css.github.io/NES.css/# nostalgic-css/NES.css: NES-style CSS Framework | ファミコン風CSSフレームワーク https://github.com/nostalgic-css/NES.css ファミコン風CSSフレームワーク「NES.css」をリリースしました | Black Everyday Company https://kuroeveryday.blo
たった数分で環境構築が完了！TypeScriptでWebアプリケーション開発ができるフレームワーク「frourio」が本当に手軽だった。 | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
たった数分で環境構築が完了！TypeScriptでWebアプリケーション開発ができるフレームワーク「frourio」が本当に手軽だった。 こんにちは、エンジニアのづやです。 突然ですがエンジニアのみなさん、TypeScriptに触れた経験はありますか？ TypeScriptはGitHubが毎年発表しているランキングで今年4位に急上昇したくらい、もっともアツいプログラム言語の1つです。 出典：https://octoverse.github.com/ しかし、いざ試してみようと思っても、 フレームワークは何を使えば良い？ どうやって導入したら良い？ など、意外とハードルって高くないですか？ そこで「frourio（フルーリオ）」という画期的なフレームワークを見つけました。こういうのってある程度経験を積んだエンジニアでないと使いこなせない……というケースも多いですよね。 でもfrourioはそ
Tailwind CSS - Rapidly build modern websites without ever leaving your HTML.
Rapidly build modern websites without ever leaving your HTML.A utility-first CSS framework packed with classes like flex, pt-4, text-center and rotate-90 that can be composed to build any design, directly in your markup. <figure class="md:flex bg-slate-100 rounded-xl p-8 md:p-0 dark:bg-slate-800"> <img class="w-24 h-24 md:w-48 md:h-auto md:rounded-none rounded-full mx-auto" src="/sarah-dayan.jpg"
シンプルなHTMLで、モダンなWebページを簡単に作成できるclassレスの超軽量CSSフレームワーク -new.css
シンプルなHTMLのみを使用して、モダンなWebページを簡単に作成できるclassレスの超軽量CSSフレームワークを紹介します。 シンプルなブログや自己紹介ページなどをさくっと作成したい時に便利で、CSSリセットとして利用するのもありかもしれません。 new.css new.css -GitHub new.cssの特徴 new.cssのデモ new.cssの使い方 new.cssの特徴 new.cssは、HTMLのみを使用してモダンなWebサイトを作成するためのclassレスのフレームワークです。HTMLの実用的なデフォルトのスタイルを活かし、美しく見えるようにスタイルされています。 超軽量4.8KbのCSSフレームワーク。 用意するのは、HTMLファイルのみ。 マークダウンで生成されたHTMLのレンダリング。 シンプルなブログや自己紹介ページに最適。 MITライセンスで、商用プロジェクト
【ワークシート付き】新社会人におすすめの実践的フレームワーク5選 - LIFE DESIGN
2016 - 06 - 11 【ワークシート付き】新社会人におすすめの実践的フレームワーク5選 思考法 フレームワーク シェアする Bookmark! Facebook Twitter Google+ Pocket 決断の速い人が使っている 戦略決定フレームワーク45 作者: 西村克己 出版社/メーカー: 学研プラス 発売日: 2012/03/22 メディア: Kindle版 この商品を含むブログを見る 記事の目的 仕事や企画などを進めるうえでよく問題になるのは、「どのように進めるべきか」を考えること。その場合、思考のツールとなるフレームワークを利用しながら、全体像と細部を詰めていくことも方法の1つである。そこで 今すぐ使える実践的なフレームワークを5つ紹介 したい。 ワークシート付きなので印刷して書き込むことはもちろん、必要に応じて自分で追記していったり、PCやスマートフォンなどのでデバ
MJML - The Responsive Email Framework
Write less, save time and code more efficientlyMJML is responsive by design on most-popular email clients, even Outlook. Write less code, save time and code more efficiently with MJML’s semantic syntax. See templates « I love MJML, it has really good solid components and a fantastic documentation » Jason Rodriguez, Product Manager These days, we email everywhere - standing up, sitting down, sleepi
JavaScriptフレームワークのコストを考える | POSTD
先日、私はBrightonで開かれたJavaScriptのカンファレンスFFConfで「(ここにライブラリやフレームワークの名前を入れる)を使おう。これこそ最強中の最強中の最強だ！」と題して話をしました。 ここに、そのプレゼンテーションの内容を書き起こします。もっと注目されるべき、最近のモバイルデバイスのフレームワークにかかるコストに関して、議論を広げる一助となればと思います。 2015年11月16日更新 – テーブルに1行、プロダクション環境下のReactについての行を追加しました。良いニュースをお伝えしますと、これはvanillaよりも3倍遅いですが、TodoMVCに関して言えば速いと言えます！PolymerのTodoMVCサンプルも最新バージョン1.2.2にアップデートされ、同様により速くなりました。 読むよりも見たい方へ、講演のビデオはこちらです。（必要なら、 スライドも入手できま
MUI - Material Design CSS Framework
The MUI package includes all the necessary code to use MUI components on the web and over email. In addition, we're working on React and WebComponents libraries to give developers more flexibility on the web. mui-0.10.3/ ├── angular │ ├── mui-angular.js │ └── mui-angular.min.js ├── css │ ├── mui.css │ ├── mui.min.css │ ├── mui-rtl.css │ └── mui-rtl.min.css ├── email │ ├── mui-email-i
Material Design Lite
Material Design Lite Material Design Lite lets you add a Material Design look and feel to your websites. It doesn’t rely on any JavaScript frameworks and aims to optimize for cross-device use, gracefully degrade in older browsers, and offer an experience that is immediately accessible. Get started now. Templates The MDL components are created with CSS, JavaScript, and HTML. You can use the compone
Flight by Twitter
Overview Flight is a lightweight, component-based JavaScript framework that maps behavior to DOM nodes. Twitter uses it for their web applications. By way of example, we've included a simple email client demo (browse the source) built over the Flight framework. There's also a flight implementation over on the todoMVC site (source), courtesy of @mkuklis Flight uses jQuery and requires a module load
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Next2D | Rendering Engine, NoCode Tool, Underlying Framework.
NES.css - NES-style CSS Framework
Bulma: Free, open source, and modern CSS framework based on Flexbox
Aurora Kit :: Pixeden
Scooter - Scooter has been deprecated
Grommet