webexpe13 / blog-template-using-nextjs-typescript-tailwindcss

This project is a simple blog template using next js, typescript and tailwind css. blog+nextjs+tailwind+typescript.
https://nextjs-simple-blog-template.web.app/
MIT License
129 stars 50 forks source link

Production Build #9

Open srinivasmaram2025 opened 1 year ago

srinivasmaram2025 commented 1 year ago

How can Use it Template For Production Build

webexpe13 commented 1 year ago

Yes sure, just tell us the website so that we can add this in our demo list.

On Sat, Oct 14, 2023, 11:20 PM Maram Srinivasa Reddy < @.***> wrote:

How can Use it Template For Production Build

— Reply to this email directly, view it on GitHub https://github.com/webexpe13/blog-template-using-nextjs-typescript-tailwindcss/issues/9, or unsubscribe https://github.com/notifications/unsubscribe-auth/A2QTN3V5OLGAWO62J33SVIDX7LGFZANCNFSM6AAAAAA6AMY2A4 . You are receiving this because you are subscribed to this thread.Message ID: <webexpe13/blog-template-using-nextjs-typescript-tailwindcss/issues/9@ github.com>

srinivasmaram2025 commented 1 year ago

Blog application using nextjs and type script

I want to Use Your Template for My Blog application, How to generate production folder to host on live. ..

webexpe13 commented 1 year ago

Run the export comand, it will generate the out folder. That is the static build folder you can upload on your server.

There is an entire article on the demo website on how to export and deploy on firebase.

https://nextjs-simple-blog-template.web.app/tutorial/how-to-deploy-blog/

On Wed, 18 Oct 2023, 6:12 pm Maram Srinivasa Reddy, < @.***> wrote:

Blog application using nextjs and type script

I want to Use Your Template for My Blog application, How to generate production folder to host on live. ..

— Reply to this email directly, view it on GitHub https://github.com/webexpe13/blog-template-using-nextjs-typescript-tailwindcss/issues/9#issuecomment-1768371215, or unsubscribe https://github.com/notifications/unsubscribe-auth/A2QTN3QVO5PNAE52Z3TGQKDX77FCJAVCNFSM6AAAAAA6AMY2A6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTONRYGM3TCMRRGU . You are receiving this because you commented.Message ID: <webexpe13/blog-template-using-nextjs-typescript-tailwindcss/issues/9/1768371215 @github.com>

srinivasmaram2025 commented 1 year ago

Thanks...

srinivasmaram2025 commented 1 year ago

D:\Full Stack\Pro Mern Stack\NextJS\blog-template-using-nextjs-typescript-tailwindcss>npm run out

nextjs-simple-blog-template@0.1.0 out next build && next export

info - Checking validity of types

Failed to compile.

./src/components/Navbar/Centered.tsx 120:13 Error: Missing "key" prop for element in iterator react/jsx-key

./src/components/Navbar/NavSideBar.tsx 57:33 Error: Missing "key" prop for element in iterator react/jsx-key

./src/components/Navbar/SimpleNavbar.tsx 50:17 Error: Missing "key" prop for element in iterator react/jsx-key

./src/components/Slider/index.tsx 26:25 Warning: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images. jsx-a11y/alt-text

info - Need to disable some ESLint rules? Learn more here: https://nextjs.org/docs/basic-features/eslint#disabling-rules

It Shows error like this, How can i Debug.

webexpe13 commented 11 months ago

Hi,

For slider alt test warning just add an alt="" to image tag. ./src/components/Slider/index.tsx 26:25 Warning: img elements must have an alt prop, either with meaningful text, or an empty string for decorative images. jsx-a11y/alt-text example: <img src='' alt='some alt text' ... />

For the rest 3 bugs ./src/components/Navbar/Centered.tsx ./src/components/Navbar/NavSideBar.tsx ./src/components/Navbar/SimpleNavbar.tsx

you might have run a loop in jsx whithout giving a key to the element. in react we need to pass a key if we are rendering thru a loop.

eample: ` { array.map(each => (

.....
            ))
        }`

please check your code and let me know if you need any more help.