Skip to content

Commit

Permalink
📝 Update README with emojis and React 17+ support note
Browse files Browse the repository at this point in the history
  • Loading branch information
almond-bongbong committed May 5, 2023
1 parent 54d9716 commit ddb754c
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 12 deletions.
27 changes: 16 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,28 +1,31 @@
# Module Template
# 🛠️ Module Template

This is a boilerplate template for creating node modules with React, TypeScript, and Rollup.

**Note: 🚀 This template supports React 17 and above, utilizing the new JSX Transform feature.**

The template includes a testing environment using Jest and React Testing Library.

## Features
## 🌟 Features

- React and TypeScript support
- Rollup bundling configuration
- Jest testing environment with React Testing Library
- ESLint and Prettier for code formatting and linting
- New JSX Transform support for React 17 and above

## Modules
## 📦 Modules

- `react` and `react-dom`: React library and its DOM manipulation utilities
- `typescript`: A superset of JavaScript that adds static types
- `rollup`: A module bundler for JavaScript applications
- `@babel/core`, `@babel/preset-env`, `@babel/preset-react`, and `@babel/preset-typescript`: Babel compiler and presets for transforming modern JavaScript, TypeScript, and React code
- `@babel/core`, `@babel/preset-env`, `@babel/preset-react`, and `@babel/preset-typescript`: Babel compiler and presets for transforming modern JavaScript, TypeScript, and React code, including the new JSX Transform
- `@testing-library/jest-dom` and `@testing-library/react`: Utilities for testing React components with Jest
- `eslint`: A pluggable and configurable linter for JavaScript and TypeScript
- `prettier`: An opinionated code formatter for JavaScript, TypeScript, and more
- `sass`: A popular CSS preprocessor

## Configuration Files
## 🔧 Configuration Files

### rollup.config.mjs

Expand All @@ -33,32 +36,34 @@ This file configures Rollup for bundling the library, with input from `./src/ind
- `rollup-plugin-typescript2`: TypeScript support for Rollup
- `rollup-plugin-peer-deps-external`: Automatically externalizes peerDependencies
- `rollup-plugin-postcss`: Adds PostCSS and Sass support for importing styles
- `@rollup/plugin-babel`: Transforms code using Babel
- `@rollup/plugin-babel`: Transforms code using Babel, including the new JSX Transform for React 17 and above
- `@rollup/plugin-eslint`: Lints the code using ESLint

### tsconfig.json

This file configures TypeScript, setting options like output directory, target, and module resolution. It also enables JSX support for React.
This file configures TypeScript, setting options like output directory, target, and module resolution. It also enables JSX support for React with the "preserve" option, allowing Babel to handle the JSX transformation.

### babel.config.js

This file configures Babel, setting presets for transforming modern JavaScript, TypeScript, and React code.
This file configures Babel, setting presets for transforming modern JavaScript, TypeScript, and React code, including the new JSX Transform for React 17 and above.

### .eslintrc.json

This file configures ESLint, with support for React and TypeScript. It also includes the `react-hooks` plugin, which enforces the Rules of Hooks in React components.

### jest.config.js

This file configures Jest for testing, setting the test environment to `jsdom` and using Babel for transforming test files. It also sets up a module name mapper for handling styles.
This file configures Jest for testing, setting the test environment to `jsdom` and using Babel for transforming test files, including the new JSX Transform for React 17 and above. It also sets up a module name mapper for handling styles.

## Usage
## 🚀 Usage

- Install dependencies: `npm install`
- Run tests: `npm run test` or `npm run test:watch`
- Build the library: `npm run build` or `npm run build:watch`
- Run the development server: `npm run dev`

## License
## 📄 License



MIT
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "module-template",
"version": "1.0.1",
"version": "1.0.2",
"description": "A feature-rich boilerplate for creating React and TypeScript node modules, complete with Rollup bundling, Jest testing environment, and ESLint & Prettier integration.",
"author": "",
"license": "MIT",
Expand Down

0 comments on commit ddb754c

Please sign in to comment.