My first next.js project deployment experience

[orassayag]

A few notes form deploying my first project in next.js (latest version):

1. The deployment is much simpler via the CLI than the Vercel website. I had to fix the project multiple times and when updating the GitHub repository not always taking the latest version of the main branch. Also, you can't force redeploy, I had to delete the project from Vercel a couple of times to force redeploy.
2. To the Vercel team, I think most of the developers work with ESlint, you may consider putting this before building, or in the CLI when entering "vercel" a question "Do you want to ignore ESlint errors? [Y/n]" that will automatically will add this to the next.config.js:

eslint: {
    // Warning: This allows production builds to successfully complete even if
    // your project has ESLint errors.
    ignoreDuringBuilds: true,
  },

3. Before switching to the CLI, I tried to deploy a couple of times via the Vercel website and got
   "BUILD_UTILS_SPAWN_1: Command "npm run build" exited with 1" which does not mean anything.
4. This is where I switch to the CLI and "npm run build" offered me the full details about my bug.
5. Also, displaying "404 page not found" when you have a bug, it's not the best way. I would expect you to show me the exact bug I get, not to freak my way out of this by Google and Stack overflow.
6. One of my bugs was that inside the "pages" folder I had several component folders with capital letters. Once I renamed them to lower case, it works. Why? and where did you write something about it in the documentation?
7. I think you should write, also, in your documentation that if you work with redux, the store must be configured in the _app.js file, not in the index.js file. This is not very clear.
8. The part of typing "vercal" and the re-deploy process automatically, is perfect. Well done Vercel team!
9. Is there any way to remove the annoying "Comment" dialog from the display?

Overall - It took me 5 hours to deploy. But I learned a lot. There is much to improve, but it was a good journey.

[amyegan]

I'm sorry your first Next.js deployment was so difficult. This info is very important for improving docs and tools, so thank you for sharing your experience! I shared this feedback with the relevant teams, but I also want to share some info here in hopes that it will help you or someone else in the future.

1. You can redeploy from the project dashboard, so you shouldn't need to delete and recreate it. (ref. Redeploy a Project)
2. You can disable ESLint rules in your next config. Or you can run the ESLint check locally by adding a script to the package.json

   "scripts": {
     "lint": "next lint"
   }

3. The error looks like it could be a platform issue and has been shared with the appropriate team. 🙇
4. I'm glad the CLI helped you with this step! 😄
5. You can find more details about the error in the project's Runtime Logs. We don't want to accidentally reveal any error info that you may prefer to keep private, so the 404 page is intentionally generic.
6. I'm not aware of this limitation and would love to see an example, if you can share one. 🙏
7. If you have any specific places in the documentation where you expect to find this info about Redux, please let me know and I'll flag it with the Docs team.
8. The CLI team will be happy to know how helpful it has been for you 🙂
9. Adding a vercel.json config with github.silent set to true will stop Vercel for GitHub commenting on PRs

[orassayag]

Hi Amy, thanks for the fast reply and I am always glad to help improve stuff.

1. Of course I used the "Redeploy" button several times, but the thing is, it doesn't always take the latest branch from the GitHub repository. I could see this on the branch name I redeployed. In general, the CLI gave me a much better experience than the website.
2. I sure know how to disable the ESLint, but I don't want to do it. I just don't have the time to fix the errors, but it doesn't mean I want it to avoid me from deploying the project. I definitely don't want to disable the eslint. Also, ESlint checks on the fly any error, so I don't need the next script to do it.
   It would be nice to suggest the CLI team:
   When entering "vercel", prompt another question "Do you want to ignore ESlint errors during build? [Y/n]", and if enter Y, that will automatically will add this to the next.config.js:

eslint: {
    // Warning: This allows production builds to successfully complete even if
    // your project has ESLint errors.
    ignoreDuringBuilds: true,
  },

3. Thanks.

4. Sure :)

5. From the CLI running "npm run build" I can see the error immediately. I don't want to work with the website anymore. Thanks.

6. You are welcome: https://stackoverflow.com/questions/58039214/next-js-pages-end-in-404-on-production-build/76074184
   (Aldo didn't work for me, and the accepted answer helped me).
   See my answer: https://stackoverflow.com/a/76074184/4442606
   In general, I would suggest, in the next.config.js, a way to config the root component. That would be the best solution.

7. You have a reference link on your FAQ: https://nextjs.org/docs/faq but I think it should be inline in your website, and not to redirect to external project of a personal from GitHub (AKA https://github.com/vercel/next.js/tree/canary/examples/with-redux) The redirect link is good as additional resources, But you have to add Redux (+Toolkit) to your docs.
   
   See other people having the same issue, and my answer:
   https://stackoverflow.com/questions/75474365/cannot-destructure-property-store-of-usereduxcontext-as-it-is-null/76072998

8. Sure.

9. Thanks a lot for the tip!

10. Another thing I forgot to add, in order to activate on Windows 10/11 the CLI, you need to run "Set-ExecutionPolicy -Scope Process -ExecutionPolicy RemoteSigned" on a shell. Otherwise it will not work. I didn't see it in the CLI docs.