question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Suggested `/about` route clashes with dynamic `/[name]` route

See original GitHub issue

Description

While following the getting start guide, the create a new project command (i.e. deno run -A -r https://fresh.deno.dev <project-name>) generates a default [name] dynamic route.

When the tutorial asks to create the about route, I believe that the new page visible at http://localhost:8000/about is captured by the [name] shipped with the create project command.

This may be confusing for some. Shall we update the docs accordingly? My assumption is that fresh prioritizes dynamic routes, is that correct?

Actual behaviour

File name Route pattern Matching paths
routes/[name].tsx /about /about

Expected behaviour

File name Route pattern Matching paths
routes/about.tsx /about /about

Issue Analytics

  • State:closed
  • Created a year ago
  • Reactions:2
  • Comments:6 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
synalicecommented, Jul 8, 2022

@ddayguerrero, it’s not something to do necessarily with Deno, but with Fresh. It seems that in Fresh, static routes do in fact also take precedence over the dynamic routes, but I’m not so sure. This needs to be tested and added into the documentation somewhere.

Can we close the issue?

1reaction
ddayguerrerocommented, Jul 8, 2022

Thanks folks! I managed to render /routes/about.tsx with the /about path correctly while still having the routes/[name].tsx route.

I believe executing deno run dev.ts generated the manifest. My fresh.gen.ts file generated:

import * as $0 from "./routes/[name].tsx";
import * as $1 from "./routes/about.tsx";
import * as $2 from "./routes/api/joke.ts";
import * as $3 from "./routes/index.tsx";
import * as $$0 from "./islands/Counter.tsx";

const manifest = {
  routes: {
    "./routes/[name].tsx": $0,
    "./routes/about.tsx": $1,
    "./routes/api/joke.ts": $2,
    "./routes/index.tsx": $3,
  },
  islands: {
    "./islands/Counter.tsx": $$0,
  },
  baseUrl: import.meta.url,
};
Screen Shot 2022-07-07 at 10 00 22 PM

I don’t remember my previous approach… I believe I tried running deno run on production entry point of my project (i.e. main.ts) 🤷

I do think that creating any /[dynamic].tsx routes in the same folder with /static.tsx routes should return either an error or a warning since it may lead to an unexpected behavior.

The idea of having a signal would be helpful. Should Deno reinforce a standard? For comparison, NextJS static routes take precedence over dynamic routes.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Dynamic vs Static Routing in React | by Chameera Dulanga
In static routing, you need to define all the routes in a centralized location in your application. Then these routes will be imported...
Read more >
Dynamic Routing Protocols - Catchpoint Systems
Introduction. Dynamic routing protocols, as their name suggests, are used to dynamically exchange routing information between routers.
Read more >
Static vs. dynamic routing: What is the difference? - TechTarget
Static routing uses preconfigured routes to send traffic to its destination, while dynamic routing uses algorithms to determine the best path.
Read more >
[RFC] Dynamic Routes · Issue #7607 · vercel/next.js - GitHub
Dynamic Routes Background Dynamic routing (also known as URL Slugs or Pretty/Clean URLs) has been a long-time requested feature of Next.js.
Read more >
Routing in Next.js – How to Set Up Dynamic Routing with Pre ...
In this tutorial, you'll learn how to set up dynamic routing in Next.js. You'll also learn about pre-rendering and why it's important.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found