Emoji Hub

Fun Bonus: EmojiHub

import { useState, useEffect } from "react"; const UrlToFetch = "https://emojihub.herokuapp.com/api/all/category_smileys_and_people"; const [emoji, setEmoji] = useState([{ htmlCode: "" }]); const [isLoaded, setIsLoaded] = useState(false); const fetchEmoji = () => { fetch(UrlToFetch) .then((res) => res.json()) .then((emoji) => setEmoji(emoji)) .then(() => setIsLoaded(true)); };

EmojiHub, an average API related specificly to emojis, this contains generating random emojis, emojis by groups, etc. Docs are on their github.

import { inject, Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; import { toSignal } from '@angular/core/rxjs-interop'; export type Product = { id: string; title: string; description: string; image: string; price: string; }; @Injectable({ providedIn: 'root', }) export class ProductsService { readonly http = inject(HttpClient); readonly API = 'https://fakestoreapi.com'; $products = toSignal(this.http.get>(`${this.API}/products`)); }

export const notNextServerSideProps = async (fetch) => { const data = await fetch('https://fakestoreapi.com/products') .then(res => res.json()) .then(json => json); return { props: { title: 'All Products', products: data } } }

This is api for fake e-commerce data https://fakestoreapi.com/

Ne treba da kreces sa backom i da pravis nista sam jos uvek, treba ti neki REST API sa dummy podacima da konzumiras i prikazujes na svom frontu. Evo ti jedan

import useSWR from "swr"; import Image from "next/image"; const fetcher = async (url) => { const response = await fetch(url); if (!response.ok) { throw new Error("An error occurred while fetching the data."); } return response.json(); }; const ProductDetails = ({ id }) => { const { data: product, error, isLoading, } = useSWR(`https://fakestoreapi.com/products/${id}`, fetcher); if (isLoading) { return

Loading...div>; } if (error) { return

Error: {error.message}div>; } return (

{product.title}h1>

div>

{product.category}p>

${product.price}p>

{product.description}p> div> div> div> ); }; export async function getServerSideProps(context) { const { id } = context.query; return { props: { id, }, }; } export default ProductDetails;

{ "products": [ { "id": 1, "title": "Fjallraven - Foldsack No. 1 Backpack, Fits 15 Laptops", "price": 109.95, "description": "Your perfect pack for everyday use and walks in the forest. Stash your laptop (up to 15 inches) in the padded sleeve, your everyday", "category": "men's clothing", "image": "https://fakestoreapi.com/img/81fPKd-2AYL._AC_SL1500_.jpg", "rating": { "rate": 3.9, "count": 120 } }, { "id": 2, "title": "Mens Casual Premium Slim Fit T-Shirts ", "price": 22.3, "description": "Slim-fitting style, contrast raglan long sleeve, three-button henley placket, light weight & soft fabric for breathable and comfortable wearing. And Solid stitched shirts with round neck made for durability and a great fit for casual fashion wear and diehard baseball fans. The Henley style round neckline includes a three-button placket.", "category": "men's clothing", "image": "https://fakestoreapi.com/img/71-3HjGNDUL._AC_SY879._SX._UX._SY._UY_.jpg", "rating": { "rate": 4.1, "count": 259 } }, { "id": 3, "title": "Mens Cotton Jacket", "price": 55.99, "description": "great outerwear jackets for Spring/Autumn/Winter, suitable for many occasions, such as working, hiking, camping, mountain/rock climbing, cycling, traveling or other outdoors. Good gift choice for you or your family member. A warm hearted love to Father, husband or son in this thanksgiving or Christmas Day.", "category": "men's clothing", "image": "https://fakestoreapi.com/img/71li-ujtlUL._AC_UX679_.jpg", "rating": { "rate": 4.7, "count": 500 } }, { "id": 4, "title": "Mens Casual Slim Fit", "price": 15.99, "description": "The color could be slightly different between on the screen and in practice. / Please note that body builds vary by person, therefore, detailed size information should be reviewed below on the product description.", "category": "men's clothing", "image": "https://fakestoreapi.com/img/71YXzeOuslL._AC_UY879_.jpg", "rating": { "rate": 2.1, "count": 430 } }, { "id": 5, "title": "John Hardy Women's Legends Naga Gold & Silver Dragon Station Chain Bracelet", "price": 695, "description": "From our Legends Collection, the Naga was inspired by the mythical water dragon that protects the ocean's pearl. Wear facing inward to be bestowed with love and abundance, or outward for protection.", "category": "jewelery", "image": "https://fakestoreapi.com/img/71pWzhdJNwL._AC_UL640_QL65_ML3_.jpg", "rating": { "rate": 4.6, "count": 400 } } ], "current_page": 1, "reach_max": false }

I'm working on a side project using fakestoreapi.com to populate data.

I am wanting to build a fake e-commerce store as a portfolio project and I was wondering if there are any good ones. Only one I know of is https://fakestoreapi.com/. Any other recommendations would be greatly appreciated!

Learn more about the API on their website.