# Page paths not working on webhost with React

**URL:** https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765
**Category:** Technical Questions
**Tags:** react
**Created:** [June 23, 2023, 5:09pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765 "2023-06-23T17:09:00Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![nnabil214](https://avatars.discourse-cdn.com/v4/letter/n/bcef8e/32.png) [@nnabil214](https://forum.builder.io/u/nnabil214)
#### Post date: [June 23, 2023, 5:09pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/1 "2023-06-23T17:09:00Z")

</div>

_Please fill out as many of the following questions as possible so we can help you promptly! If you don’t know how to answer or it does not apply, feel free to remove it or leave it blank._

**Builder content link**  
[https://tandklinik-19.vercel.app/](https://tandklinik-19.vercel.app/)

**Builder public api key**  
d5b3d969164242079a1b075ea49642ec

**What are you trying to accomplish**  
Landing page & pages with paths works fine on local enviroment (localhost) but when uploaded to a webhost such as Netlify or Vercel, I get error 404 from the webhost. Landing page works fine.

Landing page: [https://tandklinik-19.vercel.app/](https://tandklinik-19.vercel.app/)  
Page with path: [https://tandklinik-19.vercel.app/porslinskronor-fasader](https://tandklinik-19.vercel.app/porslinskronor-fasader) (not working)

**Code stack you are integrating Builder with**  
React

**Reproducible code example**  
My app.jsx

```auto
export default function CatchAllRoute() {
  const isPreviewingInBuilder = useIsPreviewing();
  const [notFound, setNotFound] = useState(false);
  const [content, setContent] = useState(null);

  // get the page content from Builder
  useEffect(() => {
    async function fetchContent() {
      const content = await builder
        .get('page', {
          url: window.location.pathname,
        })
        .promise();

      setContent(content);
      setNotFound(!content);

      // if the page title is found,
      // set the document title
      if (content?.data.title) {
        document.title = content.data.title;
      }
    }
    fetchContent();
  }, [window.location.pathname]);

  // If no page is found, return
  // a 404 page from your code.
  // The following hypothetical
  // <FourOhFour> is placeholder.
  if (notFound && !isPreviewingInBuilder) {
    return <div>Not found</div>;
  }

  return (
    <div className='w-full'>
      <BuilderComponent model='page' content={content} />
    </div>
  );
}

```

---

<div class="post-metadata">

### Author: ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)
#### Post date: [June 23, 2023, 7:02pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/2 "2023-06-23T19:02:36Z")

</div>

Hello @nnabil214,

Is this working fine on the local setup? Can you create a build version locally and see if that throws a similar error or not?

---

<div class="post-metadata">

### Author: ![nnabil214](https://avatars.discourse-cdn.com/v4/letter/n/bcef8e/32.png) [@nnabil214](https://forum.builder.io/u/nnabil214)
#### Post date: [June 23, 2023, 7:18pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/3 "2023-06-23T19:18:51Z")

</div>

![image](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/7/75f31fd350166670e6e78e9db14340ecdc7ff0be.png)  
 ![image](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/b/bc25606eab22dc88e2bc387c100f3e5c6ba6a715.png)

When building a local build it gives me same error. Only time this works is with localhost in dev enviroment.

---

<div class="post-metadata">

### Author: ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)
#### Post date: [June 23, 2023, 7:28pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/4 "2023-06-23T19:28:20Z")

</div>

Hello @nnabil214,

You are able to access the landing page fine right?

You can try changing the builder API version by adding the below code

```auto
// Put your API key here
builder.init('You API. ket');

builder.apiVersion = "v1"; // add this below builder.init

```

Let us know how that works for you.

---

<div class="post-metadata">

### Author: ![nnabil214](https://avatars.discourse-cdn.com/v4/letter/n/bcef8e/32.png) [@nnabil214](https://forum.builder.io/u/nnabil214)
#### Post date: [June 23, 2023, 8:17pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/5 "2023-06-23T20:17:32Z")

</div>

It did not work, same 404 error

---

<div class="post-metadata">

### Author: ![nnabil214](https://avatars.discourse-cdn.com/v4/letter/n/bcef8e/32.png) [@nnabil214](https://forum.builder.io/u/nnabil214)
#### Post date: [June 26, 2023, 2:25am UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/6 "2023-06-26T02:25:55Z")

</div>

Did you have an idea what could be wrong? @manish-sharma

---

<div class="post-metadata">

### Author: ![manish-sharma](https://avatars.discourse-cdn.com/v4/letter/m/8797f3/32.png) [@manish-sharma](https://forum.builder.io/u/manish-sharma)
#### Post date: [June 26, 2023, 11:13am UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/7 "2023-06-26T11:13:31Z")

</div>

Hello @nnabil214,

Would you be able to share the code sandbox of your app?

---

<div class="post-metadata">

### Author: ![nnabil214](https://avatars.discourse-cdn.com/v4/letter/n/bcef8e/32.png) [@nnabil214](https://forum.builder.io/u/nnabil214)
#### Post date: [June 26, 2023, 10:52pm UTC](https://forum.builder.io/t/page-paths-not-working-on-webhost-with-react/3765/9 "2023-06-26T22:52:09Z")

</div>

I solved it by this post [reactjs - Routes not working properly in React using Vite (ON BUILD) - Stack Overflow](https://stackoverflow.com/questions/75375772/routes-not-working-properly-in-react-using-vite-on-build)
