Deployed for free with vercelle..???

# Web Site Writing Basics # Trending # Lemon 8 Howtoo # What is vercel # Drug sign with lemon8

Vercel is the most popular Frontend cloud platform today, especially if you use React or Next.js, because Vercel created Next.js itself, making collaboration extremely "seamless."

Simply put, Vercel takes the code from your GitHub to make it a real website (URL) that is visited by the world without needing to set up a Server or rent Hosting.

The highlight of Vercel.

Auto Deploy: When you git push a job up GitHub, the Vercel will immediately know and re-update the page within seconds.

Fast & Global: The Web will be stored on the Global Edge Network, making it open from anywhere fast.

Free Tier: For personal projects or learning, free for life.

HTTPS: SSL (lock key) is available for free automatically.

Usage Steps (Connect to your Vite + React)

1. Apply

Go to Vercel.com

Select "Continue with GitHub" (recommend this method because it is very easy to connect projects)

2. Import project

Once Log in, press the "Add News" button..."and choose" Project. "

Vercel will list Repository on your GitHub. Select the project you just pushed up (such as article-for-lift) and press "Import."

3. Build settings (Configurations)

Vercel is smart enough to know this is Project Vita:

Framework Preset: Will automatically be Vite

Root Directory: No modifications required

Build Command: will be npm run building

Output Directory: For Vite, it must be dist (Vercel usually chooses for itself).

4. Deploy press

Press the "Deploy" button and wait about 1 minute. When you finish, you will get a URL such as my-app.vercel.app immediately!

Job Update Technique (The Magic of Vercel)

After this, when you finish editing the code on your computer, you just type in the original command:

Git added.

Git commit -m "Update new feat."

Git push origin main

As soon as you press Enter in verse 3, Vercel will start pulling the new code to Build and automatically update the page for you (CI / CD).

Caution for your project ⚠️

Because your project has retrieval from Google Apps Scripts:

If in your Code is also const API _ URL =. ".."Hard-code in the App.jsx file. The web will work normally.

But if in the future you store the URL in the .env file, remember to put it in the "Environment Variables" menu on Vercel's Setting page.