npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

hm-admin

v0.2.5

Published

hm-admin is an angular2 component which help you to build backoffice automatically for an hypermedia API

Downloads

4

Readme

Hm-admin

Build Status Coverage Status npm version Join the chat at https://gitter.im/coopTilleuls/hm-admin

Description

The main goal of this project is to provide a self-generated backoffice which take advantage of the context describe in Hypermedia API. This backoffice should be easy to override via simple configuration variables but must have a good abstraction to allow a deep override if the integrator need it.

The backoffice should respect some rules:

  • Keep it simple: this project will not cover all the weirdo cases that your client will invent. It's a basis. Huge enough to allow a lot of people to use it with small configuration, but a small basis to contains only required features. (In a second time, the app may be able to allow plugins to increase the features but first things first).
  • Keep it clean: this project, by default, respect some auto-discipline (coding guidelines, high code coverage ratio, ...). As this project becomes your project, it's not mandatory to follow them but if you want, you can find them right here.
  • Keep it User-friendly: this project follows the Material design recommandations to provide a full responsive and nice experience for the final user. It's not a matter about feeding the troll on the Apple/Android war. Those recommendations made their proofs so we use them.

As the full stack of typescript + compilation + tests + ... is quite pain in the ass to install, this project is based on angular-cli.

Let's start

Requirements

  • Git
  • NPM (we don't use leftpad so everything should be fine ;))
  • An Hypermedia API (Have you ever heard of API Platform?)

Installation

First, clone the project

git clone [email protected]:coopTilleuls/hm-admin.git name-of-your-project 
cd name-of-your-project

Note from Captain Obvious: Don't forget to replace name-of-your-project by your project's name.

Then you can install dependencies and start your project

npm install -g angular-cli
ng serve

And that's it...

Configuration

Nice try but your app throw an error cause it can't reach your API. Ok. Google himself doesn't know the path of your API. Or maybe they know? ... hmm. Whatever. There's a minimum configuration that is required and it's your API's path, so let's fill it in the src/app/exemples/admin/configuration.ts file. There you will find all the stuffs you can configure (items in menu, displayed field in list, ...)

Contribution

This project is pretty huge and any help is welcome so feel free to contribute. There's a lot of things to do, each level of contribution may help (documentation, hotfix, compatibility, big features, ...). Thank you.

FAQ

I want to test this awesome tool but I don't have any Hypermedia API. Do you have some advice for me?

Yes, of course. Have you ever heard of API Platform? This solution helps you to build complex API, compatible with schema.org in a few minutes without being a monster in PHP, Java or any languages. Just some configuration steps.