TamannaVerma99/JSON-Editor-Project

Check out the editor here ->

โ˜… 0Forks 0TypeScriptGitHub โ†—Compare

Project website โ†—

README

JSON Schema Tour ๐Ÿš€

Welcome to the JSON Schema Tour! This beginner-friendly project is designed to take you on an exciting journey into the world of JSON and JSON Schema validation. Whether you're a seasoned developer or just starting out, this tour will guide you through the basics of JSON Schema using the latest Draft 2020-12 specifications.

Features

  • Next.js 14.1.3: Built using the latest version of Next.js, a React framework that makes server-side rendering and static site generation simple and intuitive.
  • JSON Schema Validation: Learn how to validate JSON data using the JSON Schema Draft 2020-12 specifications.
  • Ajv Library: Implements JSON Schema validation using the Ajv library, a fast and powerful validator for JSON data.
  • Code Editor: Practice writing JSON Schemas in a code editor powered by the Codemirror library, complete with syntax highlighting and error checking.

Getting Started

To get started with the JSON Schema Tour, follow these simple steps:

  1. Clone this repository to your local machine.
  2. Install dependencies using npm install or yarn install.
  3. Start the development server using npm run dev or yarn dev.
  4. Explore the tour by navigating to the provided URLs in your browser.

File Structure

project/
|-- components/
|   |-- CodeEditor.tsx               // Component for the code editor
|
|-- pages/
|   |-- editor1/
|   |   |-- index.tsx                // First step schema validation
|   |
|   |-- editor2/
|   |   |-- index.tsx                // Second step schema validation
|   |
|   |-- firststep/
|   |   |-- index.tsx                // Tutorial for writing a JSON Schema
|   |
|   |-- secondstep/
|   |   |-- index.tsx                // Tutorial for defining an array (Step 2)
|   |
|   |-- index.tsx                    // Welcome page

Usage

Once the development server is running, you can explore the JSON Schema Tour by visiting the provided URLs:

  • /: Begin your journey with an introduction to JSON and JSON Schema basics.
  • /editor1: Practice writing JSON Schemas in a code editor and validate them against Draft 2020-12 specifications.
  • /editor2: Take your skills to the next level with advanced JSON Schema validation techniques.

Contributing

We welcome contributions from developers of all skill levels! If you'd like to contribute to the JSON Schema Tour project, please follow these steps:

  1. Fork the repository to your GitHub account.
  2. Create a new branch for your feature or bug fix.
  3. Make your changes and ensure that tests pass.
  4. Submit a pull request detailing your changes and the problem they solve.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Acknowledgements

  • Thanks to the Next.js team for creating an amazing framework for building React applications.
  • Special thanks to the Ajv and Codemirror libraries for their invaluable contributions to JSON Schema validation and code editing functionality.

Made with โค๏ธ by Tamanna

Contributors

TamannaVerma99

Issues