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

rayous

v2.8.2

Published

A mini router X ui kit with ts

Downloads

703

Readme

Rayous is a modern, lightweight, and flexible web application framework for building server-rendered web applications using TypeScript and JavaScript. With Rayous, you can quickly create web applications that embrace the power of server and client-side rendering, allowing you to deliver dynamic, interactive web experiences.

Features

  • Flexible Routing: Rayous provides a powerful routing system inspired by popular frameworks like Next.js. Define routes using a simple file structure and use dynamic parameters, giving you full control over your application's URLs.

  • Component-Based: Rayous promotes a component-based architecture, making it easy to create reusable and modular components that you can combine to build complex user interfaces.

  • TypeScript and JavaScript Support: You can develop your Rayous applications using both TypeScript and JavaScript, providing flexibility to work with your preferred language.

  • Intuitive Configuration: A simple rayous.json file allows you to configure application metadata, such as the title, author, and more, making it easy to manage your application's metadata.

  • Static Files: Rayous follows a convention where static files (e.g., images, styles, scripts) should be placed in the static/ directory located outside of the app/ folder. This separation helps maintain clarity and organization in your project.

Getting Started

To start building your web application with Rayous, follow these steps:

  1. Create a new folder and do npm init -y

  2. Install the required dependencies using npm or yarn:

    npm install rayous
  3. Configure your routes, components, and other application-specific files within the app/ directory. Make sure to include static/ for static files and rayous.json for generl information.

    npx rayous create
  4. Create reusable components in the app/components/ directory and use them in your route handlers to build your web pages.

  5. Run your Rayous application:

    npx rayous
  6. Access your application in a web browser by navigating to http://localhost:3000 or the port specified in your configuration.

Configuration

You can customize your Rayous application by editing the rayous.json configuration file. This file allows you to set the application's title, author, and other metadata that is important for SEO and presentation.

Docs and wiki

For any help, you can refer to the Rayous Docs or Rayous Github Wiki.

Examples

For example usage and additional resources, visit the Rayous GitHub repository. The repository includes code examples and detailed documentation to help you get started with Rayous.

Demo Projects

Contributions

Contributions to Rayous are welcome! If you have ideas, suggestions, or bug fixes, feel free to open issues and create pull requests on this repository.

Support

For any questions or support, please open an issue on this repository.

Happy coding with Rayous!