Social network for developers to discuss topics about bugs and issues, write and share knowledge and connect with millions of developers worldwide.
最近、AWS関連の記事8月5日、8月12日、8月18日を書いているのはバックエンドの開発を行っているからです。バックエンドはフロントエンドにAPIを提供するのが一番の目的ですが、管理画面も重要な機能だと思います。 管理画面といえば業務フローをサポートするための画面もありますが、ここではデータの確認や簡単な修正、いわゆるデーターベースのCRUD画面(Create, Read, Update, Delete)に付いての書きます。 React-admin、PostGraphileとは CRUD画面を簡単に作成できるツールやライブライリーは多く存在します。たとえばRuby on RailsにはRailsAdminのような有名なライブラリーがあります。 今回の仕事の参加する開発者はReactプログラマーなので、管理画面もReactベースのものが良いと思います。Reactベースの管理画面ライブライリー
ReactAdminを少し触ってみました。 marmelab.com そもそもReactAdminとはReactでダッシュボードを作成するためのフレームワークのようで、公式のページでは"A Web Framework for B2B applications"とあるので凝ったページというよりは一般的なダッシュページとかを簡単に作れるのかなと思います。 公式のドキュメントは以下になりまして、"Data Provider"と"Auth Provider"がAdminコンポーネントプロパティになっていまして、それぞれ一覧データの取得と認証の設定になります。それからResourceコンポーネントが一覧に出す項目の内容を設定するためのコンポーネントになっています。 marmelab.com とりあえずAuth Providerの設定を行い認証が出来るところまで確認できました。 github.com
react-admin A frontend Framework for building data-driven applications running in the browser, on top of REST/GraphQL APIs, using React and Material Design. Open sourced and maintained by marmelab. Check out the demos page for real-life examples. Installation React-admin is available from npm. You can install it (and its required dependencies) using: How To Learn React-Admin Read the Tutorial for
読んだのでメモ React-admin - My First Project Tutorial 一覧画面 React-admin では一覧表は管理画面によくあるテーブル形式で表示する。 dataProvider // in src/App.js import * as React from "react"; import { Admin } from 'react-admin'; import jsonServerProvider from 'ra-data-json-server'; const dataProvider = jsonServerProvider('https://jsonplaceholder.typicode.com'); const App = () => <Admin dataProvider={dataProvider} />; export default A
marmelab.com A frontend Framework for building data-driven applications running in the browser on top of REST/GraphQL APIs, using ES6, React and Material Design. Previously named admin-on-rest. Open sourced and maintained by marmelab. React Admin 管理画面を作るのに最適化された React アプリケーションフレームワーク France のMarmelab社によってメンテナンスされている OSS がコア Enterprise Edition もある OSS として公開していない便利な private modules が使えたり、開発サポートが受けられ
私たちの日常業務で使われる管理画面は、大量の情報と複雑な機能で構成され、利用難易度が高い傾向にあります。検索性の乏しい管理画面の一覧から1つの情報を見つけるために、どれだけの時間を費やしているでしょうか。 1億円の工数をかけて開発した機能も、低品質なデザインでは、機能の存在に気付かれなかったり、間違って使われたりと、期待した業務コストの削減に繋がりません。これでは、1億円を捨てたようなものです。 使い勝手の良くないデザインは、ユーザーだけではなく、開発者にも悪い影響を及ぼします。複雑な構造と分かりにくい操作体系の管理画面は、開発やテストの手間を増やし、その後の機能拡張も難しく、改修コストも増大します。 これらのリスクを抑えるためには、UIデザインの基本原則を理解し、適切に管理画面を設計することが重要です。 私たちは管理画面のUIデザインの改善やリニューアルを手掛けることも多いのですが、その
2018年9月にリリースした5.7以降、Laravelの未認証時のリダイレクトを実装する方法が変わりました。 バージョン5.6以前は、app/Exceptions/Handler.phpのunauthenticated関数を使っており、最近でもその方法で解説する記事も多いです。 今回は、5.7以降の実装方法について記載します。 現行版の実装方法 5.7より後(現時点では5.8)のドキュメントでは、redirectTo関数を使う前提で説明されています。 readouble.com 未認証ユーザーのリダイレクト ミドルウェアが未認証ユーザーを突き止めると、ユーザーをlogin名前付きルートへリダイレクトします。この振る舞いは、app/Http/Middleware/Authenticate.phpファイルのredirectTo関数で変更できます。 Laravel 5.8 認証より引用 そのため
Introductions Couple months ago I was trying to find a new solution for my project, and I had built a SPA dashboard with Vue (using this great framework, Laravel Lumen as API gateway, Laravel Passport as SSO server). After some weeks of working, I found that architecture has some limitations, especially in deployment and hard to open source (because many components involved, CORS setup,...). Then
Larvel+vue.jsで管理画面を作成します。 デザイン知識が乏しいのでCoreUIのFree版でUIをサクッと作ってみる。 CoreUIとは そもそもCoreUIとは、VueとBootstrapで作られた管理画面UIのフレームワークです。 Free版でも十分な部品がありますが、有料のProにすると毎回作るのが面倒なカレンダーやdatepickerなどの部品やプレミアムサポートもついてます。 ライセンスはMIT https://coreui.io/index.html Laravelをインストール 公式ガイド通りにインストールします。 <!DOCTYPE html> <html lang="{{ config('app.locale') }}"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" conte
こんにちは、Laravel で簡単に管理画面を作成できる Laractive Admin を作ったので、使い方を紹介していきたいと思います。 環境 PHP 7.2.4 Laravel 5.6.22 MySQL 5.7.22 Laractive Admin のインストール まずは Composer で Laractive Admin をインストールします。 $ composer require enomotodev/laractive-admin インストールできたら artisan コマンドで Laractive Admin を初期化します。 $ php artisan laractive-admin:install 初期化コマンドを実行すると、次のファイルが生成されます。 app/Admin/AdminUser.php app/database/migrations/[timestamp
今回はユーザーと管理者の認証を分ける方法とマルチ認証というやり方があるようなのですが、他のサイトを確認しながらやってみたのですが少しうまく行かなかったのでまとめてみました。 今回対応するのは、 認証をユーザーと管理者で分ける 管理画面は /admin/以下に配置する アカウントと登録の2つを実装する(パスワードリセット、メール認証はなし) ユーザーと管理者で管理するセッションを分ける 環境: OS : macOS Mojave 10.14.2 MAMP : 5.1 Laravel : 5.7.6 ユーザ認証までを作成する Laraveのプロジェクトを作成する composerやMAMPなどLaravelの環境については「Laravel開発:1.環境構築をMAMPを使用して作成する」に記載しているので、こちら参考にして下さい。 ・sampleという名でプロジェクトを作成します。 $ comp
WordPress投稿一覧にサムネイル・ID・スラッグ・文字数の項目を追加する方法です。 小さくて見難いですが、上記イメージはデフォルトの投稿一覧をキャプチャしたものです。 表示オプションで何もいじっていなければこの画像のように「タイトル」「作成者」「カテゴリー」「タグ」「コメント」「日時」の6項目が表示されていると思いますが、ここに個人的によく使うことがあるのではと思う「サムネイル」「ID」「スラッグ」「文字数」の4項目を新たに追加・表示させます。 実装にはを使用するので、テーマ内にない場合は作成して下記で紹介する方法をそれぞれ記述してください。 // 投稿一覧にサムネイル追加 function add_posts_columns_thumbnail( $columns ) { $columns['thumbnail'] = 'サムネイル'; return $columns; } fun
bell賞味期限切れコンテンツ この記事は公開または最終更新から1454日くらい経過しています。 このメッセージが表示されている記事(特にプログラミング系)は情報が古くなっている可能性があるので注意して下さい。 ほぼ自分用メモです。 プラグインを作ったりとか、テーマの独自オプションページを作るときに便利そうな、WordPressの管理画面などで利用されている汎用的なクラスをすこし調べてみました。 ボタンとかメッセージボックスって別にそこまでデザインを凝るつもりはないにしても、ただ字をだすだけでは味気がなさすぎるよな…というときに使えるかもしれません。 はじめに WordPress3.8.1 で自分がつかってるなかで見つけたものです。これらのIDやクラスはもしかしたら将来的にバージョンアップで変更になる可能性もあり、そうなった場合はまたIDやクラスを調べる必要があるかもしれません。 また、今
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く