https://github.com/autumnnus/javascript-methods
This is a React Typescript Project about Javascript beginners will learn Javascript's most important methods.
https://github.com/autumnnus/javascript-methods
javascript javascript-methods react redux typescript
Last synced: about 1 month ago
JSON representation
This is a React Typescript Project about Javascript beginners will learn Javascript's most important methods.
- Host: GitHub
- URL: https://github.com/autumnnus/javascript-methods
- Owner: Autumnnus
- Created: 2023-12-10T20:49:25.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-01-15T22:37:45.000Z (over 2 years ago)
- Last Synced: 2025-02-24T01:22:01.151Z (about 1 year ago)
- Topics: javascript, javascript-methods, react, redux, typescript
- Language: TypeScript
- Homepage: https://javascriptmethods.netlify.app
- Size: 221 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# JS Methods Explorer 🚀
A premium, developer-centric interactive playground built to master JavaScript's core methods. Explore String, Array, Number, Date, and Math methods through a structured, human-made UI design.
## ✨ Features
- **Professional UI**: A sleek, dark-themed interface inspired by modern developer tools (e.g., VS Code, Linear).
- **Interactive Playground**: Test JavaScript methods in real-time with dynamic inputs and instant output feedback.
- **Comprehensive Coverage**:
- **Strings**: Manipulation, searching, and formatting.
- **Arrays**: Iteration, transformation, and state management.
- **Numbers**: Parsing, validation, and precision.
- **Dates**: Formatting and time calculations.
- **Math**: Static constants and mathematical functions.
- **Randomizer**: Quickly generate example use cases with the click of a button.
- **Syntax Highlighting**: Clean and readable code previews for every method.
## 🛠️ Tech Stack
- **Framework**: [React](https://reactjs.org/) (with TypeScript)
- **Styling**: [Tailwind CSS](https://tailwindcss.com/)
- **State Management**: [Redux Toolkit](https://redux-toolkit.js.org/)
- **Icons**: [React Icons](https://react-icons.github.io/react-icons/)
- **Build Tool**: [Vite](https://vitejs.dev/)
## 🚀 Getting Started
Follow these steps to set up the project locally:
### 1. Clone the repository
```bash
git clone https://github.com/VectortheGreat/Javascript-Methods.git
cd Javascript-Methods
```
### 2. Install dependencies
```bash
npm install
```
### 3. Run the development server
```bash
npm run dev
```
The app will be available at `http://localhost:5173`.
## 📖 Usage
1. Select a category from the navigation bar (e.g., Array, String).
2. Choose a specific method from the sidebar list.
3. Use the **Randomize** button to see a working example.
4. Modify the input values or parameters to see how the output changes instantly.
## 🤝 Contributing
Contributions are welcome! If you'd like to improve the documentation, add new methods, or enhance the UI:
1. Fork the project.
2. Create your feature branch (`git checkout -b feature/AmazingFeature`).
3. Commit your changes (`git commit -m 'Add some AmazingFeature'`).
4. Push to the branch (`git push origin feature/AmazingFeature`).
5. Open a Pull Request.
---
Crafted with ❤️ by [Vector](https://github.com/VectortheGreat)