open-index/open-npm huggingface dataset:
npm package: 404-creator
Description: Generate beautiful 404 pages with animations in one line!
Author: Manindra Bollam
Latest version: 1.0.1

# 404-Creator 🚀

![npm](https://img.shields.io/npm/v/404-creator)
![license](https://img.shields.io/npm/l/404-creator)
![downloads](https://img.shields.io/npm/dt/404-creator)

A zero-dependency package to generate beautiful, animated 404 pages with one line of JavaScript! Perfect for React, Vue, Next.js, and plain HTML projects.

## Features ✨

- 🎨 **4 built-in color themes** (purple, blue, red, green)
- 🕹️ **3 animation types** (floating, glitch, pulse)
- 📱 **Fully responsive**
- 🚫 **No dependencies**
- ⚡ **Under 2KB gzipped**

## Installation 📦

```bash
npm install 404-creator
# or
yarn add 404-creator
# or
pnpm add 404-creator
```

## Basic Usage 🛠️

```js
import { create404 } from "404-creator";

// Minimal usage (default styling)
create404();

// With custom options
create404({
  title: "Oops! Lost in Space",
  message: "This page doesn't exist in our universe",
  animation: "glitch",
  color: "blue",
});
```

## Advanced Options ⚙️

| Option      | Type                                           | Default                                        | Description       |
| ----------- | ---------------------------------------------- | ---------------------------------------------- | ----------------- |
| `title`     | `string`                                       | `"404 - Page Not Found"`                       | Main heading text |
| `message`   | `string`                                       | `"The page you're looking for doesn't exist."` | Subtitle text     |
| `animation` | `"floating"` \| `"glitch"` \| `"pulse"`        | `"floating"`                                   | Animation style   |
| `color`     | `"purple"` \| `"blue"` \| `"red"` \| `"green"` | `"purple"`                                     | Color theme       |

## Framework Examples 🖇️

## React Example

```js
import { useEffect } from "react";
import { create404 } from "404-creator";

function NotFoundPage() {
  useEffect(() => {
    create404({
      title: "React 404",
      animation: "pulse",
    });
  }, []);

  return null; // This will replace the entire page
}
```

## Next.js API Route

```js
import { create404 } from "404-creator";

export default function Custom404() {
  if (typeof window !== "undefined") {
    create404();
  }
  return null;
}
```

## Custom Styling 🎨

You can override the default styles by adding your own CSS:

```css
.container {
  font-family: "Comic Sans MS", cursive;
}

.home-link {
  background: #ff5722 !important;
}
```

### 📝 License

This project is licensed under the MIT License.

### 📣 Author

Made with ❤️ by Manindra Bollam(manindra810@gmail.com)
npm package: 404-explorer
Description: Ultra-light zero-config helper that turns your 404s into an interactive treasure map for real routes, recent misses, and smart suggestions.
Author: luoevanescence
Latest version: 0.1.0

# 404 Explorer（中文版）

[English](README.md) · [中文版本](README.zh-CN.md)

一个零配置、超轻量的 404 调试助手。只需在 Express / Koa / Fastify 应用的末尾加上一行，就能把普通 404 页面变成“寻宝地图”，展示真实路由、最近踩空记录以及智能猜测。

## 核心特性

- 自动列出项目已注册的路由
- 基于 Levenshtein 距离的“猜你想去”提示
- 记录最近的 404（次数 + 时间戳）
- `?json` 切换 JSON 模式，方便自动化
- 通过 `EXPLORER_404_COLOR` 设置主题色

## 安装

```bash
npm i 404-explorer
```

## 使用方法

```js
// Express、Koa、Fastify 等入口文件
require('404-explorer')(app)
```

访问不存在的地址（例如 `http://localhost:3000/helo`）即可看到极简 404 面板；追加 `?json` 可查看同样信息的 JSON 版。

## 示例站点

项目自带 `example/` 目录，可快速体验：

```bash
cd example
npm init -y
npm i express
node server.js
```

浏览器访问 `http://localhost:3000/` 或任何不存在的路径，观察 404 Explorer 的交互。

## 可选参数

```js
require('404-explorer')(app, {
  routes: ['/custom/list'], // 提供自定义路由列表，跳过自动发现
  router: appRouterInstance, // 传入自定义 router 以扫描路由
})
```

## 后续小升级灵感

- 暴露 `/~routes` 接口，方便 CI 做死链扫描
- 提供主题 / CSS 变量自定义
- 导出 404 统计数据，接入监控面板

需要发布到 npm？请参考 `PUBLISH.zh-CN.md`。也欢迎 PR，一起保持它的“小而美” ✨
npm package: 404-page
Description: 404 page with animation and your picture in it!
Author: ShaharEli
Latest version: 1.0.4

# 404-page

> 404 page with animation and your picture in it!

[![NPM](https://img.shields.io/npm/v/404-page.svg)](https://www.npmjs.com/package/404-page) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)

## Install

```bash
npm install --save 404-page
```

## Usage

```jsx
import React from 'react'

import {LostPage} from '404-page'
import '404-page/dist/index.css'

const Example = () => {
  
    return <LostPage face={ optional your face image (default is my face) } backgroundColor={ optional (default is space)} audio={ optional your audio} />
  
}
```
## Optional parameters:
1. face > default is my face image with your face. 
2. backgroundColor > default is space  you can choose from cool linear gradient backgrounds (purple,black and blue). 
3. audio > audio to play in your 404 page. 

## Some preview:
![alt text](preview.png)

## License

MIT © [ShaharEli](https://github.com/ShaharEli)
npm package: 404-pagelet
Description: Default 404 Pagelet used if the router cannot dispatch to any route
Author: Martijn Swaagman
Latest version: 1.0.5

# 404 Pagelet

[![Version npm][version]](http://browsenpm.org/package/404-pagelet)[![Build Status][build]](https://travis-ci.org/bigpipe/404-pagelet)[![Dependencies][david]](https://david-dm.org/bigpipe/404-pagelet)[![Coverage Status][cover]](https://coveralls.io/r/bigpipe/404-pagelet?branch=master)

[version]: http://img.shields.io/npm/v/404-pagelet.svg?style=flat-square
[build]: http://img.shields.io/travis/bigpipe/404-pagelet/master.svg?style=flat-square
[david]: https://img.shields.io/david/bigpipe/404-pagelet.svg?style=flat-square
[cover]: http://img.shields.io/coveralls/bigpipe/404-pagelet/master.svg?style=flat-square

This Pagelet is responsible for displaying server errors. By
default the 404 Pagelet is provided with [BigPipe]. However, if you
need a custom 404 you can extend this Pagelet. For example to change
the default view.

## Installation

The 404 Pagelet is distributed through the node package manager (npm).

```
npm install --save 404-pagelet
```

## Support

Got stuck? Or can't wrap your head around a concept or just want some feedback,
we got a dedicated IRC channel for that on Freenode:

- **IRC Server**: `irc.freenode.net`
- **IRC Room**: `#bigpipe`

Still stuck? Create an issue. Every question you have is a bug in our
documentation and that should be corrected. So please, don't hesitate to create
issues, many of them.

### Example

In this example the 404 Pagelet is extended with a custom view.
[BigPipe] will automatically discover this extended version
if it is provided to [BigPipe] alongside the other pagelets.

```js
'use strict';

//
// Extend the 404 Pagelet with a custom view.
//
var Fourofour = require('404-pagelet').extend({
  view: '/path/to/my/custom-view.html'
});

//
// Initialise BigPipe server.
//
var pipe = require('bigpipe').createServer(2000, {
  pagelets: [ Fourofour, ... ]
});
```

## Debugging

The library makes use the `diagnostics` module from Pagelet.
To display the 404 Pagelet specific debug messages, supply the
following before running the program or

```bash
DEBUG=pagelet:404 node ...
```

## Testing

Tests are automatically run on [Travis CI] to ensure that everything is
functioning as intended. For local development we automatically install a
[pre-commit] hook that runs the `npm test` command every time you commit changes.
This ensures that we don't push any broken code in to this project.

To run tests locally, make sure the development dependencies are installed.

```bash
npm test
npm run coverage
```

## License

404-pagelet is released under MIT.

[BigPipe]: http://bigpipe.io/
[Travis CI]: http://travisci.org
[Temper]: http://github.com/bigpipe/temper
[pre-commit]: http://github.com/observing/pre-commit
npm package: 404notfoundpage
Description: =>npm i 404notfoundpage<=
Latest version: 3.0.0

# NotFoundPage Component

=>npm i 404notfoundpage<=

The `NotFoundPage` component is a React component designed to display a custom 404 error page with a user-friendly message, a link to the homepage, and an image.

## Features

- Displays a 404 Not Found error message.
- Provides a link back to the homepage.
- Shows an image related to the error.

## Usage

### 1. Add the Page to Your Project

Ensure you have an image that represents the 404 error.Hosted Somewhere with Read Permissons

### 2. Import and Use the `NotFoundPage` Component

First, import the `NotFoundPage` component into your file
=>>>>npm i 404notfoundpage

```typescript
import { NotFoundPage } from '404NotFoundPage'; //
   <Route component={

    <NotFoundPage
      message="Oops! The page you are looking for does not exist."
     linkText="Return Home"
     imageUrl="/images/custom-404.png " // Preferr to give hosted image only
/>
   } /> Adjust the code as necessary
```