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

metis-ui-x

v0.0.9

Published

[![Build Status](https://travis-ci.org/europeana/metis-ui.svg?branch=develop)](https://travis-ci.org/europeana/metis-ui)

Downloads

1

Readme

Metis

Build Status

Repository Contents

This repository is an angular workspace configured to build the projects:

  • metis-ui
  • metis-sandbox

Getting started (Metis-UI and Sandbox)

Make sure you have node version 14.7.8 and npm version 6.x:

node --version
npm --version

Get the npm dependencies:

npm install

Build the shared library:

npm run build-shared

Getting started (Metis-UI)

To run the Metis UI you need to provide a backend server to connect to. Modify the file projects/metis/src/assets/env.js by filling in the URLs

Getting started (Sandbox)

To run the Sandbox you need to provide a backend server to connect to. Copy apisettings-test.ts to apisettings.ts and fill in the URL's:

cp projects/metis/src/environments/apisettings-example.ts projects/metis/src/environments/apisettings.ts

Development server

Run npm start-metis or just npm startfor a dev server. Navigate to http://localhost:4200/. The (metis-ui) app will automatically reload if you change any of the source files.

Run npm start-sandbox to run a dev server for the sandbox.

Branches and Pull Requests

The main branch for development is the develop branch. But do NOT use this branch directly! Use a new branch for features/bugs and give it a descriptive name containing the user story code, like:

feat/MET-1535-dataset-page-styling
bug/MET-3245-dashboard-not-loading

If you push a branch or commit to GitHub, it will automatically be tested by Travis CI. This will take about 5 mins and the results will be shown in GitHub, e.g. in the pull request page.

If the tests fail, there is often a small linting or formatting error (see Linting and code formatting ). Run this command and check if it fixes the tests:

npm run fix

Make a pull request in GitHub for code review and merging.

Linting and code formatting

We use prettier and eslint to check and fix the code. Just run this command after making changes or before committing:

npm run fix

You can also run the tools separately:

npm run prettier
npm run lint

Test

All tests (CI)

To run the full test suite:

npm test

This is the same command that Travis and jenkins run to test our code.

Unit tests (development)

To run the unit tests in development (watch mode):

npm run test:dev

You can also use Wallaby (heartily recommended!) by using the included wallaby.js file.

E2E tests (development)

To run the cypress tests:

npm run test:e2e

To run the cypress tests in development (watch mode), start the dev server in one terminal window:

npm run start:ci

...start the dev data server in another terminal window:

npm run start:ci-data

...and then run cypress in another window:

npm run cypress

Accessibility tests (development)

To run the accessibility tests:

npm run test:accessibility

Template check (development)

We use Angular AOT compiling with fullTemplateTypeCheck: true to do limited checking of the templates. This is run as part of npm test but you can also run it manually:

npm run template-check

Build

Run npm run build-metis or npm run build-sandbox to build a single project, or run npm run build to build both projects. The build artifacts will be stored in the relative projects/[PROJECT_NAME]/dist/ sub-directories.

Use npm run dist-metisor npm run dist-sandbox for a production build (stored in the /dist directory).

Deploy

We use jenkins to deploy. Make sure you can access https://jenkins.eanadev.org/ and use the following jobs:

  • develop_deploy-test_metis-ui-angular_bluemix
  • develop_deploy-acceptance_metis-ui-angular_bluemix
  • branch_deploy-production_metis-ui-angular_bluemix
  • Sandbox-UI-Test

The test and acceptance jobs should be run off the develop branch.

Docker

To make a (parameterised) docker image of either app first build the shared library:

npm run build-shared

And then from the root of the project build the app, so either:

npm run dist-metis or npm run dist-sandbox

The docker nginx image is the built with either:

docker build -t metis-ui-app-image:version projects/metis/ or docker build -t sandbox-ui-app-image:version projects/sandbox/

Once the values in projects/[PROJECT_NAME]/env_file have been set then the generated docker image can be ran with either:

docker run -it --rm -d -p 8080:8080 --env-file=./projects/metis/deployment/local/env_file -v ./projects/metis/src/static/nginx-docker.conf:/etc/nginx/nginx.conf --name metis-ui andyjmaclean/metis-ui:v11

or:

docker run -it --rm -d -p 8080:8080 --env-file=projects/sandbox/env_file --name sandbox-ui sandbox-ui-app-image:version

Kubernetes

Running the script:

./k8s-deploy.sh -i myDockerImage

will deploy either app (metis by default) to a local Kubernetes cluster.

The script accepts the parameter flags:

  • -c (context) the kubernetes context
  • -d (delete) flag that the app should be deleted
  • -p (project) either sandbox or metis
  • -h (help) shows a help message
  • -i (image) the application image to deploy
  • -r (replicas) hyphen-separated integers defining the min / max number of replicas
  • -t (target) the deploy target: local, test, acceptance, production
  • -u (utilisation) the CPU usage threshold for autoscaling

so the command:

`./deployment/k8s-deploy.sh -d -t acceptance -i myMetisDockerImage`

...will delete myMetisDockerImage in the default context with the acceptance namespace,

and the command:

`./deployment/k8s-deploy.sh -p sandbox -i mySandboxDockerImage`

...will deploy mySandboxDockerImage to the local namespace.

Release

The release documentation is in the "Release Metis UI/Metis Framework/ECloud manual" document on Google Docs.

License

Licensed under the EUPL v. 1.2.

For full details, see LICENSE.md.