Most websites require some form of user profile or account in order to access the full benefits that the site provides. In order to test these functions, software developers usually have to create personas to test their projects, and these can get repetitive and time consuming. Luckily, Random User Generator provides an API that generates personas and their accounts for you to test with. Upon rendering or refreshing the website, the API gives an example on how countless users can be generated with names, emails, phone numbers, addresses, and account passwords. The API can generate other information such as company, role, likes and dislikes and more. Utilizing this API for testing and website demos can be a powerful tool.
Under the documentation of the website, you can use the link in the method shown below to fetch a random user. You can also test out this link by copying and pasting it in your web browser. The information is unstyled and simple text, so that it can be utilized and reformatted easily for your personal use. In the example, the name and picture of the user is displayed. For a step by step explanation of the example below, click here.
componentDidMount(){
fetch(“https://randomuser.me/api/“)
.then((response) => response.json())
.then((response) => {
this.setState({
Items:response.results,
Loading:true
})
})
render(){
var{items,loading} = this.state
if(!loading){
return(
<div>Loading …</div>
)
} else {
return (
<div className=”container”>
{items.map(item => (
<h1>{item.name.first}</h1>
<img src ={item.picture.medium} alt={item.name.first}/>
)}
)
}
}
}
export default App;
The Random User API website also outlines other functions it provides, such as displaying a specific number of users and each of their information. The information can easily be called from the fetched data as shown above and arranged as intended for the website.The combination of information with your website can allow you to create fully functional unique demos of personas and make your site look fuller. Displaying the generated information can be in any form, from a dialogue box to redirecting a user to a different page. Both of these are provided as a guide from States N Hooks, along with many other useful API implementations and React functions. Whichever way you choose to utilize the Random User Generator API is up to you for your own purposes.
