JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
    • 0
  • Score
    100M100P100Q32053F
  • License MIT

A package that generates a React landing page with styling and layout guidelines

Package Exports

  • genai_web_development
  • genai_web_development/createFiles.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (genai_web_development) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

GenAI Web Development

Description

This NPM package automatically generates a complete React landing page setup including:

  • A components directory with LandingPage.js
  • Comprehensive styling guidelines (styling-guide.md)
  • Detailed layout specifications (layout.md)
  • Additional utility files

Installation

npm install genai_web_development

Generated Files

The package creates the following structure:

your-project/
├── components/
│   └── LandingPage.js
├── styling-guide.md
├── layout.md
└── [additional utility files]

Key Features

  • Styling Guide: Complete Tailwind CSS styling specifications including color palette, typography, and interaction guidelines
  • Layout System: Detailed component layouts with SVG illustrations and responsive design specs
  • React Components: Pre-built landing page component following modern best practices

Usage

The files are automatically generated during package installation. You can also generate them manually:

const generator = require('genai_web_development');
generator();

Styling Guidelines

The package implements a comprehensive design system including:

  • Modern color palette with semantic usage
  • Typography scale with responsive considerations
  • Interactive states and animations
  • SVG illustration specifications

Layout System

Includes detailed specifications for:

  • Navigation components
  • Hero section layout
  • Responsive breakpoints
  • Spacing system
  • SVG illustration guidelines

License

MIT

Construction prompt

Write the code for the LandingPage.js file using the description provided in the layout.md file and the styling guidelines provided in the styling-guide.md file.