Code Monkey home page Code Monkey logo

jpdict's Introduction

JP Dict

This is a Japanese word search application that allows users to search for Japanese words and view their meanings, readings, tags, frequency, and other information. Both English and Japanese is avaliable. The app consists of a backend API built with Express.js and TypeScript, and a frontend user interface built with Angular.

assets/example.gif

Backend

The backend is an Express.js server that provides an API endpoint for searching Japanese words. The word data is loaded from JSON files containing term banks. The main components of the backend are:

  • dictionaryController.ts: Contains the logic for searching words and returning the results.
  • dictionary.ts: Defines the API route for the word search endpoint.
  • app.ts: Sets up the Express.js application and middleware.
  • index.ts: Starts the server and listens for incoming requests.

The backend also includes a preprocessing script (preprocess.ts) that adds romaji readings to the term bank data using the Kuroshiro library.

Frontend

The frontend is an Angular application that provides a user interface for searching Japanese words and displaying the results. The main components of the frontend are:

  • word-search.component.ts: Contains the logic for handling user input, making API requests, and displaying search results.
  • word-search.component.html: Defines the HTML template for the word search component.
  • word-search.component.scss: Contains the styles for the word search component.
  • word.service.ts: Provides a service for making HTTP requests to the backend API.
  • tag-explanation.component.ts: Displays explanations for tags when hovering over them.

The frontend also includes features such as:

  • Pagination of search results
  • Customizable background image
  • Tag explanations on hover
  • Color-coded result items

Setup and Usage

  1. Clone the repository.
  2. Install dependencies: npm install
  3. Start the app:
    • Option 1: npm start (starts both backend and frontend)
    • Option 2: Run the start.bat script (starts app and opens browser)
  4. The app will be available at http://localhost:4200
  5. Close the app: Run the stop.bat script

Enter a Japanese word in the search box and click the "Search" button or press Enter. The app will display the matching results with their readings, meanings, tags, and other information. Use the pagination controls to navigate through the results.

Data

The word data is stored in JSON files in the back/src/data directory. The index.json file contains an index of the available term banks. The tag_bank_1.json file contains explanations for the tags used in the word data. The term_bank_*.json files contain the actual word data.

Dependencies

  • Express.js
  • TypeScript
  • Angular
  • Kuroshiro
  • kuromoji

License

JMdict and JMnedict

The original XML files - JMdict.xml, JMdict_e.xml, and JMnedict.xml - are the property of the Electronic Dictionary Research and Development Group, and are used in conformance with the Group's license. Project started in 1991 by Jim Breen.

All derived files are distributed under the same license, as the original license requires it.

This project is open-source and available under the MIT License.

jpdict's People

Contributors

luna5akura avatar

Stargazers

Elouann avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.