https://github.com/kanokpit-yowaratch/nextjs-upload-file

File upload and file manager client-side by Next.js
https://github.com/kanokpit-yowaratch/nextjs-upload-file

axios eslint mui-material nextjs nextjs14 react typescript upload upload-file upload-images

Last synced: about 1 month ago
JSON representation

File upload and file manager client-side by Next.js

• Host: GitHub
• URL: https://github.com/kanokpit-yowaratch/nextjs-upload-file
• Owner: kanokpit-yowaratch
• Created: 2023-12-23T15:51:55.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-02-06T05:35:13.000Z (11 months ago)
• Last Synced: 2024-02-06T21:19:24.158Z (11 months ago)
• Topics: axios, eslint, mui-material, nextjs, nextjs14, react, typescript, upload, upload-file, upload-images
• Language: TypeScript
• Homepage: https://nextjs-upload-file-gules.vercel.app
• Size: 251 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


  

    

  

  

  

  

    

  

  

    

  



# nextjs-upload-file

Example of client-side file upload in Next.js

## Tech Stack

  `React` `TypeScript` `NextJS`

## Environment configuration

Create `.env` file and set variable

```bash

# host

NEXT_PUBLIC_API="http://54.255.239.151:5000"

NEXT_PUBLIC_HOST_NAME="54.255.239.151"

NEXT_PUBLIC_PROTOCOL="http"

# host

# NEXT_PUBLIC_API="https://seer-of-human.com"

# NEXT_PUBLIC_HOST_NAME="seer-of-human.com"

# NEXT_PUBLIC_PROTOCOL="https"

# local

# NEXT_PUBLIC_API="http://localhost:3000"

# NEXT_PUBLIC_HOST_NAME="localhost"

# NEXT_PUBLIC_PROTOCOL="http"

```

## Run app

  ```

  npm install

  npm run dev

  ```

## Build and Deploy

  ```

  npm run build

  npm start

  ```

  ## Deploy on Vercel

  

  Live Demo: nextjs-upload-file

  API Repo: https://github.com/kanokpit-yowaratch/nestjs-upload-api

  API Demo: https://seer-of-human.com