Daniel Sousa @TutoDS Comments

Daniel Sousa @TutoDS

Explore posts from servers

SSolidJS RRefine

Posts Comments

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

But refreshing the page everything seems ok again

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

Any idea?

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

Sorry for the noob question, if I leave the website open for a few hours and back there and switch to another page I receive a client unexpected error

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

I use the client to get the content

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

No, this a sanity cms project, not an api

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

But any suggestion to avoid users seeing hold content?

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

I start using only one component and need to put it in every page, didn’t found a better solution 😦

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

For example today I open on my mobile device and the content is the older one when I update the content 3 days ago. Only after switch between pages changes

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

I update the content on sanity And if I refresh the page the content don’t change I need to switch between pages

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

But I have this behavior

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

Sorry back to this

16 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

I change everything to PageSeo and use it with the title as optional

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

Any suggestion?

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

routes/projects/[slug.tsx]

<Show when={data()} keyed={true}>
      {(project) => (
        <>
          <PageSeo
            title={project.title}
            keywords={[
              project.title.toLowerCase(),
              ...project.services.map((service) => service.title.toLowerCase()),
            ]}
            description={
              project.description
                ? getTruncatedStringWithEllipsis(project.description)
                : undefined
            }
            image={urlFor(project.thumbnail)
              .width(800)
              .height(600)
              .auto('format')
              .url()}
          />
          ...
)}
</Show>

<Show when={data()} keyed={true}>
      {(project) => (
        <>
          <PageSeo
            title={project.title}
            keywords={[
              project.title.toLowerCase(),
              ...project.services.map((service) => service.title.toLowerCase()),
            ]}
            description={
              project.description
                ? getTruncatedStringWithEllipsis(project.description)
                : undefined
            }
            image={urlFor(project.thumbnail)
              .width(800)
              .height(600)
              .auto('format')
              .url()}
          />
          ...
)}
</Show>

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

And the usage:

app.tsx

<Router
      preload={true}
      root={(props) => (
        <Suspense fallback={<LoadingScreen />}>
          <MetaProvider>
            <DefaultSeo />
            <Header mode="solid" />

            {props.children}

            <CtaSection />

            <Footer />
          </MetaProvider>
        </Suspense>
      )}
    >
      <FileRoutes />
    </Router>

<Router
      preload={true}
      root={(props) => (
        <Suspense fallback={<LoadingScreen />}>
          <MetaProvider>
            <DefaultSeo />
            <Header mode="solid" />

            {props.children}

            <CtaSection />

            <Footer />
          </MetaProvider>
        </Suspense>
      )}
    >
      <FileRoutes />
    </Router>

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

import { Link, Meta, Title } from '@solidjs/meta';
import { createAsync } from '@solidjs/router';
import { Show } from 'solid-js';

function DefaultSeo() {
  const seoSettings = createAsync(() => getSeoSettings(), { deferStream: true });

  return (
    <>
      <Meta charset="UTF-8" />
      <Meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <Meta http-equiv="content-language" content="Portuguese" />
      <Meta name="language" content="Portuguese" />

      {/* Default social tags */}
      <Meta property="og:locale" content="Portuguese" />
      <Meta property="og:type" content="website" />

      {/* Favicon */}
      <Link rel="icon" href="/logo.svg" type="image/svg+xml" />

      {/* Robots */}
      <Meta name="robots" content="index, follow" />

      <Show when={seoSettings()} keyed={true}>
        {(seo) => (
          <>
            <Title>{seo.title}</Title>

            <Show when={seo.description} keyed={true}>
              {(description) => <Meta name="description" content={description} />}
            </Show>
            <Meta name="keywords" content={seo.keywords?.join(', ')} />

            {/* Social tags */}
            <Meta property="og:site_name" content={seo.title} />
            <Meta property="og:title" content={seo.title} />
            <Meta property="og:description" content={seo.description} />

            <Show when={seo.thumbnail} keyed={true}>
              {(thumbnail) => (
                <Meta
                  property="og:image"
                  content={urlFor(thumbnail)
                    .width(800)
                    .height(600)
                    .auto('format')
                    .url()}
                />
              )}
            </Show>
          </>
        )}
      </Show>
    </>
  );
}

export { DefaultSeo };

import { Link, Meta, Title } from '@solidjs/meta';
import { createAsync } from '@solidjs/router';
import { Show } from 'solid-js';

function DefaultSeo() {
  const seoSettings = createAsync(() => getSeoSettings(), { deferStream: true });

  return (
    <>
      <Meta charset="UTF-8" />
      <Meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <Meta http-equiv="content-language" content="Portuguese" />
      <Meta name="language" content="Portuguese" />

      {/* Default social tags */}
      <Meta property="og:locale" content="Portuguese" />
      <Meta property="og:type" content="website" />

      {/* Favicon */}
      <Link rel="icon" href="/logo.svg" type="image/svg+xml" />

      {/* Robots */}
      <Meta name="robots" content="index, follow" />

      <Show when={seoSettings()} keyed={true}>
        {(seo) => (
          <>
            <Title>{seo.title}</Title>

            <Show when={seo.description} keyed={true}>
              {(description) => <Meta name="description" content={description} />}
            </Show>
            <Meta name="keywords" content={seo.keywords?.join(', ')} />

            {/* Social tags */}
            <Meta property="og:site_name" content={seo.title} />
            <Meta property="og:title" content={seo.title} />
            <Meta property="og:description" content={seo.description} />

            <Show when={seo.thumbnail} keyed={true}>
              {(thumbnail) => (
                <Meta
                  property="og:image"
                  content={urlFor(thumbnail)
                    .width(800)
                    .height(600)
                    .auto('format')
                    .url()}
                />
              )}
            </Show>
          </>
        )}
      </Show>
    </>
  );
}

export { DefaultSeo };

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/28/2024 in #support

Default SEO vs Route SEO

import { Link, Meta, Title } from '@solidjs/meta';
import { createAsync } from '@solidjs/router';
import { Show } from 'solid-js';

function DefaultSeo() {
  const seoSettings = createAsync(() => getSeoSettings(), { deferStream: true });

  return (
    <>
      <Meta charset="UTF-8" />
      <Meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <Meta http-equiv="content-language" content="Portuguese" />
      <Meta name="language" content="Portuguese" />

      {/* Default social tags */}
      <Meta property="og:locale" content="Portuguese" />
      <Meta property="og:type" content="website" />

      {/* Favicon */}
      <Link rel="icon" href="/logo.svg" type="image/svg+xml" />

      {/* Robots */}
      <Meta name="robots" content="index, follow" />

      <Show when={seoSettings()} keyed={true}>
        {(seo) => (
          <>
            <Title>{seo.title}</Title>

            <Show when={seo.description} keyed={true}>
              {(description) => <Meta name="description" content={description} />}
            </Show>
            <Meta name="keywords" content={seo.keywords?.join(', ')} />

            {/* Social tags */}
            <Meta property="og:site_name" content={seo.title} />
            <Meta property="og:title" content={seo.title} />
            <Meta property="og:description" content={seo.description} />

            <Show when={seo.thumbnail} keyed={true}>
              {(thumbnail) => (
                <Meta
                  property="og:image"
                  content={urlFor(thumbnail)
                    .width(800)
                    .height(600)
                    .auto('format')
                    .url()}
                />
              )}
            </Show>
          </>
        )}
      </Show>
    </>
  );
}

export { DefaultSeo };

import { Link, Meta, Title } from '@solidjs/meta';
import { createAsync } from '@solidjs/router';
import { Show } from 'solid-js';

function DefaultSeo() {
  const seoSettings = createAsync(() => getSeoSettings(), { deferStream: true });

  return (
    <>
      <Meta charset="UTF-8" />
      <Meta name="viewport" content="width=device-width, initial-scale=1.0" />
      <Meta http-equiv="content-language" content="Portuguese" />
      <Meta name="language" content="Portuguese" />

      {/* Default social tags */}
      <Meta property="og:locale" content="Portuguese" />
      <Meta property="og:type" content="website" />

      {/* Favicon */}
      <Link rel="icon" href="/logo.svg" type="image/svg+xml" />

      {/* Robots */}
      <Meta name="robots" content="index, follow" />

      <Show when={seoSettings()} keyed={true}>
        {(seo) => (
          <>
            <Title>{seo.title}</Title>

            <Show when={seo.description} keyed={true}>
              {(description) => <Meta name="description" content={description} />}
            </Show>
            <Meta name="keywords" content={seo.keywords?.join(', ')} />

            {/* Social tags */}
            <Meta property="og:site_name" content={seo.title} />
            <Meta property="og:title" content={seo.title} />
            <Meta property="og:description" content={seo.description} />

            <Show when={seo.thumbnail} keyed={true}>
              {(thumbnail) => (
                <Meta
                  property="og:image"
                  content={urlFor(thumbnail)
                    .width(800)
                    .height(600)
                    .auto('format')
                    .url()}
                />
              )}
            </Show>
          </>
        )}
      </Show>
    </>
  );
}

export { DefaultSeo };

9 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/21/2024 in #support

Cache with sanity

Can I remove the cache and keep using it on createAsync?

const getTotalOfProjects = cache(async (serviceSlug?: string): Promise<number> => {
  try {
    let total = 0;

    if (serviceSlug) {
      total = await client.fetch<number>(getTotalOfProjectsFromServiceQuery, {
        serviceSlug,
      });
    } else {
      total = await client.fetch<number>(getTotalOfProjectsQuery);
    }

    return total;
  } catch {
    return 0;
  }
}, 'total-projects');

const getTotalOfProjects = cache(async (serviceSlug?: string): Promise<number> => {
  try {
    let total = 0;

    if (serviceSlug) {
      total = await client.fetch<number>(getTotalOfProjectsFromServiceQuery, {
        serviceSlug,
      });
    } else {
      total = await client.fetch<number>(getTotalOfProjectsQuery);
    }

    return total;
  } catch {
    return 0;
  }
}, 'total-projects');

16 replies

SSolidJS

•Created by narmia on 6/22/2023 in #support

Anyone one have any insight on how to integrate a Meta/FB Pixel with a SolidStart site?

Did you face this:window.fbq is not a function

14 replies

SSolidJS

•Created by Daniel Sousa @TutoDS on 10/20/2024 in #support

Add scripts to header from string

Bu that isn't only for SSR?

19 replies

Gaming

Programming