riccardogiorato

function Home() {
  return (
    <>
      <h1>My Homepage</h1>
      <img 
        className="m-2 w-10 sm:w-20 self-center"                                          
        src="/me.png"
        alt="Picture of the author"
      />
      <p>Welcome to my homepage!</p>

riccardogiorato

import Image from 'next/image'

function Home() {
  return (
    <>
      <h1>My Homepage</h1>
      <div className="m-2 w-10 sm:w-20 self-center">
        <Image
            src="/me.png"
            alt="Picture of the author"

riccardogiorato

module.exports = {
  plugins: [
    "tailwindcss",
    [
      "@fullhuman/postcss-purgecss",
      process.env.NODE_ENV === "production"
        ? {
            // the paths to all template files
            content: [
              "./pages/**/*.{js,jsx,ts,tsx}",

riccardogiorato

module.exports = {
  future: {
    removeDeprecatedGapUtilities: true,
    purgeLayersByDefault: true,
  },
  purge: false,
  theme: {
    extend: {},
  },
  variants: {},

riccardogiorato

export default function Home() {
  return (
    <div className="bg-white shadow p-3 rounded lg:w-64">
      <div>
        <div className="bg-cover bg-center bg-gray-300 h-32 rounded"></div>
      </div>
      <div className="mt-6">
        <p className="text-lg text-bold tracking-wide text-gray-600 mb-2">
          Title
        </p>

riccardogiorato

const MeiliSearch = require("meilisearch");

(async () => {
  try {
    const config = {
      host: 'http://127.0.0.1:7700'
    };

    const meili = new MeiliSearch(config);

riccardogiorato

 useEffect(() => {
    let arrayItems = [];
    for (let i = 0; i < resultSearch.length; i++) {
      const product = resultSearch[i];
      arrayItems.push(
        <div class="flex w-full sm:w-1/2 md:w-1/3 lg:w-1/4 xl:w-1/6 p-3">
          <a
            href={product.url}
            class="flex-1 rounded overflow-hidden shadow-lg"
          >

riccardogiorato

  useEffect(() => {
    // Create an scoped async function in the hook
    async function searchWithMeili() {
      const search = await index.search(searchedWord);
      setResults(search.hits);
    }
    // Execute the created function directly
    searchWithMeili();
  }, [searchedWord]);

riccardogiorato

import React, { useState, useEffect } from "react";

// TODO configure the MeiliSearch Client 

function App() {
  const [searchedWord, setSearch] = useState("dumbell");
  const [resultSearch, setResults] = useState([]);
  const [resultCards, setCards] = useState([]);

  // TODO add function to send searchedWord to MeiliSearch

riccardogiorato

const MeiliSearch = require("meilisearch");

(async () => {
  try {
    const config = {
      host: 'http://127.0.0.1:7700'
    };

    const meili = new MeiliSearch(config);