Web API about 🍜

Overview

Ramen API 🍜

Ramen API is a free Web API about 🍜 . This API is designed for the purpose of testing a software application which is accessing Web APIs. For example, you can use Ramen API for prototyping your React, Vue, or Angular web pages.

You can try Ramen API with this code.

fetch('https://ramen-api.dev/shops/yoshimuraya')
  .then((res) => res.json())
  .then((json) => console.log(json.shop.name)) // => 吉村家

This repository manages the source code and the content including photos.

You might want to say why Ramen? And, I will say. 🍜 is super delicious!! 😋

Features

  • 🌟 Support REST API and GraphQL.
  • 🖼️ We can get an information of Ramen shops and their rich photos.
  • 🆓 Completely free.
  • 🧑‍💻 You can contribute by adding Ramen content.

Information

  • Currently, Ramen API is a beta version. There's a possibility that API may be changed.
  • You should show the credit like "powered by Ramen API" on your page and link to this GitHub repository.
  • The information of Ramen shops and photos are distributed under the Creative Commons copyright license CC/BY.
  • If you want to use photos in your application publicly, you should show the author id or name of the photos as the credit.
  • Authentication is not required.
  • There is no rate-limitation.

Base URL

https://ramen-api.dev

REST API

SS

Global parameters

  • pretty - Flag of JSON pretty printing.

GET /shops

Parameters

  • page - default is 1.
  • perPage - default is 10. Maximum value is 100.

Examples

GET /shops?pretty&page=1&perPage=3
{
  "shops": [
    {
      "id": "yoshimuraya",
      "name": "吉村家",
      "photos": [
        {
          "name": "yoshimuraya-001.jpg",
          "width": 1200,
          "height": 900,
          "authorId": "yusukebe",
          "url": "https://ramen-api.dev/images/yoshimuraya/yoshimuraya-001.jpg"
        }
      ]
    },
    {
      "id": "sugitaya",
      "name": "杉田家",
      "photos": [
        {
          "name": "sugitaya-001.jpg",
          "width": 1200,
          "height": 900,
          "authorId": "yusukebe",
          "url": "https://ramen-api.dev/images/sugitaya/sugitaya-001.jpg"
        }
      ]
    },
    {
      "id": "takasagoya",
      "name": "たかさご家",
      "photos": [
        {
          "name": "takasagoya-001.jpg",
          "width": 1200,
          "height": 900,
          "authorId": "yusukebe",
          "url": "https://ramen-api.dev/images/takasagoya/takasagoya-001.jpg"
        }
      ]
    }
  ],
  "totalCount": 7,
  "pageInfo": {
    "nextPage": 2,
    "prevPage": null,
    "lastPage": 3,
    "perPage": 3,
    "currentPage": 1
  }
}

GET /shops/{shopId}

Examples

GET /shops/yoshimuraya
{
  "shop": {
    "id": "yoshimuraya",
    "name": "吉村家",
    "photos": [
      {
        "name": "yoshimuraya-001.jpg",
        "width": 1200,
        "height": 900,
        "author": "yusukebe",
        "url": "https://ramen-api.dev/images/yoshimuraya/yoshimuraya-001.jpg"
      }
    ]
  }
}

GET /authors/{authorId}

Examples

GET /authors/yusukebe
{
  "author": {
    "id": "yusukebe",
    "name": "Yusuke Wada",
    "url": "https://github.com/yusukebe"
  }
}

Errors

Not Found

HTTP Status code is 404.

Sample response:

{
  "errors": [
    {
      "message": "The requested Ramen Shop 'foo' is not found"
    }
  ]
}

GraphQL

Ramen API supports a GraphQL.

SS

Endpoint

https://ramen-api.dev/graphql

Schemas

Shop

type Shop {
  id: String
  name: String
  photos: [Photo]
}

Photo

type Photo {
  name: String
  url: String
  width: Int
  height: Int
  authorId: String
}

Author

type Author {
  id: String
  name: String
  url: String
}

Queries

shop

query {
  shop(id: "yoshimuraya") {
    id
    name
    photos {
      name
      width
      height
      url
      authorId
    }
  }
}

shops

query {
  shops(first: 1, after: "eW9zaGltdXJheWE=") {
    edges {
      node {
        id
        name
      }
      cursor
    }
    pageInfo {
      startCursor
      endCursor
      hasNextPage
      hasPreviousPage
    }
  }
}

Or you can set last and before args.

query {
  shops(last: 1, before: "eW9zaGltdXJheWE=") {
    pageInfo {
      startCursor
      endCursor
      hasNextPage
      hasPreviousPage
    }
  }
}

author

query {
  author(id: "yusukebe") {
    id
    name
    url
  }
}

Contribution

You can contribute by adding Ramen content to this project. Not only by writing code.

Adding a new shop

1. Fork & clone

Fork this repository and clone it.

2. Edit the author information

If this is first time, you should write about you.

mkdir ./content/authors/{authorId}
touch ./content/authors/{authorId}/info.json

Edit ./content/authors/{authorId}/info.json like this:

{
  "id": "yusukebe", // <-- must be /^[0-9a-zA-Z\-\_]+$/
  "name": "Yusuke Wada",
  "url": "https://github.com/yusukebe" // <-- must be /^https:\/\/.+$/
}

3. Edit about the Ramen shop

Write the information of the Ramen shop which you want to add.

mkdir ./content/shops/{shopId}
touch ./content/shops/{shopId}/info.json

Edit ./content/shops/{shopId}/info.json like this:

{
  "id": "yoshimuraya", // <-- must be /^[0-9a-z\-]+$/
  "name": "吉村家",
  "photos": [
    {
      "name": "yoshimuraya-001.jpg", // <-- must be /^[0-9a-z\-\.]+\.(jpg|jpeg|png|gif)$/
      "width": 1200, // <-- must be number
      "height": 900, // <-- must be number
      "authorId": "yusukebe" // <-- must be /^[0-9a-zA-Z\-\_]+$/
    }
  ]
}

4. Add Photo

Add your Ramen photos to an appropriate path such as ./content/shops/{shopId}/{photoName}.

cp IMG_001.JPG ./content/shops/{shopId}/{photoName}

5. Add shopId to shops.json

At the end, edit ./content/shops.json to add the shop id at the last line.

{
  "shopIds": [
    "yoshimuraya",
    "sugitaya",
    "takasagoya",
    "jyoujyouya",
    "torakichiya",
    "rasuta",
    "new-shop-id" // <--- add the id at the last line
  ]
}

6. Pull Request

Create Pull Request to this repository.

Notices

Tips

Resize & Optimize photos

Resize:

sips -Z 800 yoshimuraya-001.jpg

Get the image size:

sips -g pixelHeight -g pixelWidth yoshimuraya-001.jpg

Remove Exif and optimize the image:

jpegtran -copy none -optimize -outfile yoshimuraya-001.jpg yoshimuraya-001.jpg

Projects using Ramen API

Author

Yusuke Wada https://github.com/yusukebe

❤️ 🍜

License

Application source code is distributed under the MIT license.

Ramen resources including the photos are distributed under the Creative Commons copyright license CC/BY.

You might also like...

An open source API wrapper for TechHost API.

TechHost API Wrapper An open source API wrapper for TechHost API. Badges Installation Install techhost-api-wrapper with npm. npm install techhost-api-

Jun 23, 2022

Weather Application built using ReactJs , OpenCage API and OpenWeatherMap API

Weather-bot Netlify Site Status : Weather application built using ReactJs, OpenCage Api and OpenWeatherMap Api Tech Stack and Dependencies Name Descri

Oct 17, 2022

Example CRUD API for API Fest'22. See Pull Requests for chapter 2 and 3

Example CRUD API for API Fest'22. See Pull Requests for chapter 2 and 3

Mar 2, 2022

The leaderboard website displays scores submitted by different players. It also allows you to submit your score. All data is preserved thanks to the external Leaderboard API service. Build with Html, CSS, JS, API, and Webpack.

The leaderboard website displays scores submitted by different players. It also allows you to submit your score. All data is preserved thanks to the external Leaderboard API service. Build with Html, CSS, JS, API, and Webpack.

Mar 11, 2022

Essa API tem como objetivo auxiliar na produção de documentação de métodos e design packs, fornecendo de maneira visual a documentação de cores para api's

Essa API tem como objetivo auxiliar na produção de documentação de métodos e design packs, fornecendo de maneira visual a documentação de cores para api's

DocColors-API Essa API tem como objetivo auxiliar na produção de documentação de métodos e design packs, fornecendo de maneira visual a documentação d

Feb 4, 2022

A serverless AWS expense tracker API. AWS Lambda functions, API gateway, and Dynamodb are among the ingredients.

AWS-Serverless-API A serverless AWS expense tracker API. AWS Lambda functions API gateway Dynamodb Endpoints Create a new expense: Method: POST Body f

Jul 16, 2022

This is a vanilla Node.js rest API created to show that it is possible to create a rest API using only vanilla Node.js

This is a vanilla Node.js rest API created to show that it is possible to create a rest API using only vanilla Node.js. But in most cases, I would recommend you to use something like Express in a production project for productivity purposes.

Jul 19, 2022

News API Wrapper for Violetics API News

News API Wrapper for Violetics API News

Mar 23, 2022

Rent-A Movie is a website based on movie renting. The user can leave likes, comments or make reservations for movies they would like to rent. Made using tvMaze API, Involvement API, HTML, SASS and JavaScript

Rent-A Movie is a website based on movie renting. The user can leave likes, comments or make reservations for movies they would like to rent. Made using tvMaze API, Involvement API, HTML, SASS and JavaScript

Rent-A Movie "Rent-A Movie" is a website for movie renting where you can make reservations, add comments & likes or just get details about movies that

Aug 23, 2022
Comments
  • TODO

    TODO

    • [ ] tag?
    • [x] ~versioning API~
    • [x] show powered by credit
    • [x] GraphQL, Pagination
    • [x] exports encode/decode base64 in Hono
    • [x] pretty
    • [x] Write API spec
    • [x] ~Documentation in Japanese~
    • [x] Documentation in English
    • [x] ~Logo images?~
    • [x] Add shops
    • [x] /shop/:id return 404
    • [x] ci
    • [x] CD
    • [x] LICENSE
    • [x] Validate content
    • [x] Add uploaded by or author user information?
    • [x] ~linter~ and prettier
    • [x] photo > name => photo => name , url
    • [x] ~~Pager in REST API~~
    • [x] ~~Rate limit~~
    • [x] ~random Endpoint?~
    • [x] ~pager in REST API~
    • [x] /authors/{author_id} endpoint
    • [x] ~trail slash~
    • [x] CORS
    • [x] Example application https://github.com/yusukebe/ramen-api-example
    • [x] Photo width/height?
    • [x] ~resizer~
    • [x] ~tags~
    • [x] ~cache response~
    • [x] ~address property for shops?~
    • [x] limitation /shops
    opened by yusukebe 0
This project is built with JavaScript, Webpack, HTML & CSS, Leaderboard api. When user clicks on Refresh button it hits the api and responds with the data, The user can also post data to the api

leaderboad Description the project. this project is about the leaderboad i did during Microverse to build a website for adding Data to the API and fet

Emmanuel Moombe 4 May 30, 2022
This project is a Web application based on an external API. The API provides data about music (including artists, albums, etc) that users can access on-demand. This project was built with ES6, HTML and CSS and it is a SPA.

Capstone M2: Music App This project is a Web application based on the music API Napster built with ES6, HTML and CSS and it is a SPA. This API provide

Karla Delgado 12 Aug 29, 2022
TV Shows Web App - A web application based on an external API which contains information about TV shows

TV Shows Web App - A web application based on an external API which contains information about TV shows. th web app let you like the shows that you like the most and comment what you think about them making use of an involvement API to save this interaction information.

Williams Colmenares 14 Dec 17, 2022
TV Shows Web App - A web application based on an external API which contains information about TV shows

TV Shows Web App - A web application based on an external API which contains information about TV shows. th web app let you like the shows that you like the most and comment what you think about them making use of an involvement API to save this interaction information.

Williams Colmenares 14 Dec 17, 2022
Unofficial API client for the Tidbyt API. Use this client to control Tidbyt devices and integrate with other services.

Tidbyt Client for Node.js Unofficial API client for the Tidbyt API. Use this client to control Tidbyt devices and integrate with other services. Insta

Nicholas Penree 19 Dec 17, 2022
Webb-tracker-api - James Webb Space Telescope (JWST) tracking REST API

James Webb Telescope tracking REST API Public REST API to track JWST's current status API data source: https://www.jwst.nasa.gov/content/webbLaunch/wh

Aslan Vatsaev 67 Nov 22, 2022
To-do-expressJS-api - An ExpressJS API, where you can create your own To-Do's

ExpressJS to-do API What is this API about? This is an API where you can do the following: Log in. Sign up. Create task Read Task Update Task Delete T

Pértile Franco Giuliano 1 Jan 3, 2022
Base-mock-api - Repo to storage my fake api's to use in my 2022 projects.

Base Mock API's Project made 100% with JavaScript, with the objective of creating endpoints to use in projects. Prerequisites Before you begin, ensure

Arthur Cabral 0 Nov 20, 2022
Lolis-rest - RESTful API for lolis-api

Lolis REST RESTful + Website for Lolis API. Introduction This is a RESTful API which will be used on Lolis API Website and Wrapper. This API uses Imgu

Waifu.sbs 3 Aug 11, 2022
JavaScript API based capstone project using TVmaze API for displaying and interacting with items from the data base.

Yuriy Chamkoriyski & Bonke Gcobo Javascript capstone project API-based webapp from Module 2 at Microverse Wireframe requirements The Home Page low fid

Yuriy Chamkoriyski 5 May 30, 2022