Home > Web Front-end > JS Tutorial > The All-in-One Fake API for developers.

The All-in-One Fake API for developers.

Patricia Arquette
Release: 2024-12-26 20:58:11
Original
183 people have browsed it

Introducing FooApi

I am excited to announce a personal project I’ve been working on: fooapi.com. The service isn’t 100% complete yet—some features are still in development—but I plan to share progress and updates with each new release. This project began with the idea of creating a single platform to access data on various topics through different methods. The platform provides realistic dummy data across several categories, which you can use to mock your projects and ideas.

  • Users
  • Products
  • Posts
  • Comments
  • To-dos
  • Images
  • Movies
  • Songs
  • Cities (GeoJSON)
  • Countries (GeoJSON geometries)

You can find all the details in fooapi.com/docs

How to use it?

Currently there are two ways to fetch the data:

  1. REST endpoints
  2. GraphQL queries
  3. (Would you like gRPC?)

If you go to fooapi.com/playground you can practice and test your queries

Some useful examples

Here are some practical examples of how to use FooApi.

1) Do you want to create simple placeholder images? easy:

fooapi.com/imgmaker/700/500/ff0000/000000/foooo

The All-in-One Fake API for developers.

With this endpoint, you can customize dimensions (width and height), background color, font color (Hex format), and add a custom message.

/imgmaker/:width/:height/:bg/:fn/:text
Copy after login

More details in fooapi.com/docs/images

2) Do you want data to test your maps? just use:

fetch('https://fooapi.com/api/cities?limit=3')
  .then(res => res.json())
  .then(data => console.log(data))
Copy after login

The All-in-One Fake API for developers.

The data for this category is real and not artificially generated because, in a real map, we should use actual coordinates, in case you’re wondering.

3) Something simple and useful is fetch a random user:

fetch('https://fooapi.com/api/users/rand')
  .then(res => res.json())
  .then(data => console.log(data))
Copy after login

Response:

{
    id: "1",
    name: "John",
    lastname: "Doe",
    username: "JohnxDoe11",
    birthdate: "1990-01-01",
    age: 30,
    gender: "Male",
    phone: "+63 791 675 8914",
    email: "foo@example.com",
    country: "USA",
    height: 170,
    weight: 70
}
Copy after login

4) Are you developing the next social media hit? check:

fetch('https://fooapi.com/api/comments')
  .then(res => res.json())
  .then(data => console.log(data))
Copy after login

Response:

[
    {
        id: "1",
        comment: "Sunshine and sci-fi sounds like a perfect combo! Enjoy getting lost in your book ",
        reactions: 0,
        postId: "1",
        user: {
            id: "50",
            name: "John",
            lastname: "Smith",
            username: "SmiJohnxD100"
        }
    },
    {
        id:"2",
        comment:"Don't forget the sunscreen!  What sci-fi are you reading?",
        reactions:1,
        postId:"1",
        user:{
             id:"2",
             name:"Akira",
             lastname:"Von Trier",
             username:"alphaVonAkirax853"
          }
    }
    "28 more elements..."
]
Copy after login

Now you are free to explore the data categories.

What do you think?

I’d love to hear your feedback! Remember, you can use this service to mock your apps, designs, models, etc. If you have ideas for new data categories or features, please share them in the comments.

The above is the detailed content of The All-in-One Fake API for developers.. For more information, please follow other related articles on the PHP Chinese website!

source:dev.to
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template