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

@davidlj95/ngx-meta

v1.0.0-beta.31

Published

Set your Angular site's metadata: standard meta tags, Open Graph, Twitter Cards, JSON-LD structured data and more. Supports SSR (and Angular Universal). Use a service. Use routes' data. Set it up in a flash! πŸš€

Downloads

1,855

Readme

<ngx-meta/> for Angular

Angular Supports Angular SSR/Universal

NPM Downloads NPM License NPM Version Main CI/CD workflow Codecov GitHub last commit (branch)

Coded in Typescript Git GitHub Package manager: pnpm Unit tests with Jasmine Unit tests ran by Karma E2E tests with Cypress Code coverage with Codecov Linted with ESLint Formatted with Prettier Commits follow Conventional Commits convention Git hooks with Husky GitHub Actions Released with Semantic Release Dependencies updated with Renovate Docs with Material for Mkdocs API Report/Docs with API Extractor Contributor Covenant

Set your Angular site's metadata: standard meta tags, Open Graph, Twitter Cards, JSON-LD structured data and more. Supports SSR (and Angular Universal). Use a service. Use routes' data. Set it up in a flash! πŸš€

[!NOTE] Current version is a beta. APIs are now very stable and very open for feedback. Version 1.0.0 will be published after it has been in the wild for a while

Motivation

You have a nice Angular-powered website. You want to improve its SEO and decide to add some metadata in your pages. You also enable Server Side Rendering (SSR) so when search engines visit your site, metadata elements are already in the HTML returned by the server. You start adding nice <meta name="description"> to describe your home page. Then Open Graph metadata like <meta property="og:title"> to customize social cards / link previews. You use Angular's Meta APIs to insert those in your DOM. All good so far 😊

Now, you want to set metadata for another page of your site πŸ€”

Calls to Angular Meta APIs start appearing in many places around. Object literals specifying <meta> definitions breed like rabbits πŸ‡ You also have to ensure when changing pages that metadata from a page doesn't stay there when visiting another. It's all starting to be a bit tedious πŸ˜…

If only there was a way to easily specify metadata I want for each page in a declarative fashion and forget about it πŸ™ You're in the right place then πŸŽ‰ This library will definitely help you πŸ₯³

πŸ—ΊοΈ Start exploring

New users

First, welcome πŸ₯°

Wondering why this library and not another one? Take a look at why section. Probably most interesting parts are features and comparison pages.

For the hands-on devs (this is the way), get started now ⚑️

Existing users

Take a look at guides to refresh your knowledge. Like the one about setting metadata programmatically using the service, in a declarative fashion using route's data. Or how metadata values JSON is shaped.

Go deeper by:

Are you by any chance looking for the API reference?