/react-fakers

React-Fakers is a collection of dummy data for application development testing

Primary LanguageJavaScriptOtherNOASSERTION

React Fakers

React Fakers is a collection of dummy data from the most popular dummy data providers such as Json Place Holder, Faker, Pokemon, etc, for application development testing.

logo

TABLE OF CONTENT

INSTALLATION:

npm i react-fakers | yarn add react-fakers

EXAMPLE USAGE

  • Hooks

    • useFaker
    import React, { useState, useEffect } from 'react'
import { useFaker } from 'react-fakers'

const App = () => {
  const [state, setState] = useState(false)
  const { success, error } = useFaker()

  useEffect(() => {
    if (success) {
      setState(true)
    }
  }, [])

  if (error) {
    window.alert(error.message)
  }

  return (
    <>
      {!state && <h4>Loading....</h4>}
      {state &&
        success.map((val, id) => (
          <ul key={val.uuid}>
            <li>
              {val.firstname} {val.lastname} - {val.email}
            </li>
          </ul>
        ))}
    </>
  )
}

export default App
    • useJsonPlaceHolder
    import React, { useState, useEffect } from 'react'
import { useJsonPlaceHolder } from 'react-fakers'

const App = () => {
  const [state, setState] = useState(false)
  const { success, error } = useJsonPlaceHolder()

  useEffect(() => {
    if (success) {
      setState(true)
    }
  }, [])

  if (error) {
    window.alert(error.message)
  }

  return (
    <>
      {!state && <h4>Loading....</h4>}
      {state &&
        success.map((val, id) => (
          <ul key={id}>
            <li>
              {val.name} - {val.email}
            </li>
          </ul>
        ))}
    </>
  )
}

export default App

  • Components

    • Faker
    import React, { Component } from 'react'
import { Faker } from 'react-fakers'

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      loading: false,
      data: []
    }
  }

  onSuccess = (res) => {
    this.setState({
      loading: true,
      data: res
    })
  }

  onError = (error) => {
    if (error) {
      window.alert(error.message)
    }
  }

  render() {
    return (
      <>
        <Faker success={this.onSuccess} error={this.onError} />
        {!this.state.loading && <h4>Loading....</h4>}
        {this.state.loading &&
          this.state.data.map((val, id) => (
            <ul key={val.uuid}>
              <li>
                {val.firstname} {val.lastname} - {val.email}
              </li>
            </ul>
          ))}
      </>
    )
  }
}

export default App
    • JsonPlaceHolder
    import React, { Component } from 'react'
import { Faker } from 'react-fakers'

class App extends Component {
  constructor(props) {
    super(props)
    this.state = {
      loading: false,
      data: []
    }
  }

  onSuccess = (res) => {
    this.setState({
      loading: true,
      data: res
    })
  }

  onError = (error) => {
    if (error) {
      window.alert(error.message)
    }
  }

  render() {
    return (
      <>
        <JsonPlaceHolder success={this.onSuccess} error={this.onError} />
        {!this.state.loading && <h4>Loading....</h4>}
        {this.state.loading &&
          this.state.data.map((val, id) => (
            <ul key={id}>
              <li>
                {val.name} - {val.email}
              </li>
            </ul>
          ))}
      </>
    )
  }
}

export default App

API REFERENCE

  • HOOKS
Name Property Type Data Optional/Required Default Value Description
useFaker type string optional users To display dummy data from the Faker API
params object optional { }
useJsonPlaceHolder type string optional users To display dummy data from the Json Place Holder API
params object optional { }
options object optional { limit: 0 }
filters object optional { }
useDummy type object optional user To display dummy data from the Dummy API
apiKey string optional 5faa1fab5317ae96860c0be3
params object optional { }
options object optional { limit: 0 }
filters object optional { }
useUIFaces apiKey string optional 43651248-182440F6-8653E4E2-5438FCB2 To display dummy data from the UI Faces API
params object optional { limit: 10 }
  • COMPONENTS
Name Property Type Data Optional/Required Default Value Description
Faker success function required To display dummy data from the Faker API
error function optional
type string optional users
params object optional
JsonPlaceHolder success function required To display dummy data from the Json Place Holder API
error function optional
type string optional users
options object optional { limit: 0 }
filters object optional { }
Dummy success function required To display dummy data from the Dummy API
error function optional
apiKey string optional 5faa1fab5317ae96860c0be3
params object optional { }
options object optional { limit: 0 }
filters object optional { }
UIFaces success function required To display dummy data from the UI Faces API
error function optional
apiKey string optional 43651248-182440F6-8653E4E2-5438FCB2
params object optional { limit: 10 }

API STATUS

API Name API Key Call Per/Day Call Per/Month
Faker No Unlimited unlimited
Json Place Holder No Unlimited unlimited
Dummy API Yes 500 undefined
UI Faces Yes 500 undefined

API LIST

API Name Status Documentation
Faker Ready Click Here
Json Place Holder Ready Click Here
Dummy API Ready Click Here
UI Faces Ready Click Here
Pokemon Comingsoon Click Here
Star Wars Comingsoon Click Here
Marvel Comingsoon Click Here
Harry Potter Comingsoon Click Here
IMDB Comingsoon Click Here
The Cat Comingsoon Click Here
Anime Comingsoon Click Here
Ricky And Morty Comingsoon Click Here
Unsplash Comingsoon Click Here
Listen Notes Comingsoon Click Here

TRANSLATION

NOTES

  • For Dummy Data that uses API KEY if you have a limit, please visit the API provider service, to get your own API KEY
  • For more information on the API available, you can visit the official documentation of each Provider
  • To make a contribution to the project you can throw an issue or you can clone the repository and perform a Pull Request
  • To find out more about using this tool, you can open the app-dev/src/examples in this repository

AUTHOR

BUGS

For information on bugs related to package libraries, please visit here

LICENSE

BACK TO TOP