ווי צו שיקן אַ 3 ד שפּיל אויף Vercel דעם אָפּרוטעג (מיט AI סקילס)

Idée am Freitog, live URL am Sontog. Der Three.js + Cursor + Vibe Skills + Vercel free tier playbook fer a 3D spiel in 48 stunden zu shippen.

3D GamesVercelThree.jsVibe CodingVibe Skills
Sarah Mitchell
Sarah Mitchell
Creator editorial lead
9,623
ווי צו שיקן אַ 3 ד שפּיל אויף Vercel דעם אָפּרוטעג (מיט AI סקילס) - Vibe Skills preview
Vibe Skills
Vibe Skills

בלעטער הונדערטער פון רעדי-געמאכטע געניטקייטן פֿאַר Claude, Cursor, און מער.

שיקן אַ 3 ד שפּיל אויף ווערסעל דורך זונטיק אויפנאַכט: דער 48-שעהדיקער דעפּלייַ פּלייַבאָק

איר קענט גיין פון אַ ליידיק פרייטיק אָוונט צו אַ your-game.vercel.app לינק דורך זונטיק מיטאָג. דער סטאַק איז Three.js, Cursor, אַ קונסט-געשטיצטע קוואַליטעט פון Vibe Skills, און די Vercel פֿרייַ טיר. גאַנץ קאָסטן פֿאַר די וויקענד: $0. גאַנץ ינפראַסטרוקלטור איר האָבן צו באַבעסעטן: אויך נול.

דאָס איז נישט "בויען אַ פּראָסטאָטיפּ אויף דיין לאַפּטאַפּ און רופן עס פאַרטיק". דאָס איז אַ ציבור URL וואָס יעדער אין דער וועלט קען עפֿענען אין אַ בלעטערער, ​​מיט HTTPS, עדזש קאַטשינג, און אַ קאַסטומער דאָומיין אויב איר ווילט איינער. די קונסט-געשטיצטע קוואַליטעט שיפּט די Three.js סקאַפאָלדינג און אַ ארבעטן vercel.json. Cursor האַנדלט די יטעראַציע לופּ. Vercel האַנדלט די דעפּלייַ. איר האַנדלט די פּלאַן.

די פירער איז פֿאַר ינדי דעוועלאָפּערס, ווייב קאָדערס, האַקאַטהאָן אָנטיילנעמערס, און ווער עס יז וואס איז מיד פון האַלב-פאַרטיק localhost:5173 טאַבס. מיר דעקן וואָס די סטאַק אַרבעט, די 48-שעהדיקע דעפּלייַ אַנאַטאָמי, פינף 3 ד שפּיל קוואַליטעטן געבויט פֿאַר די ווערקפלאָו, און די פרייטיק-צו-זונטיק שריט-פֿאַר-שריט.


ווי צו שיקן אַ 3 ד שפּיל אויף Vercel דעם אָפּרוטעג (מיט AI סקילס) - Vibe Skills preview
Vibe Skills
Vibe Skills

בלעטער הונדערטער פון רעדי-געמאכטע געניטקייטן פֿאַר Claude, Cursor, און מער.

פאַרוואָס ווערסעל + Three.js + קונסט-געשטיצטע קוואַליטעטן איז דער סאָלאָ דעוועלאָפּער סטאַק

Vercel איז די מערסט פויל מעגלעך דעפּלייַ ציל פֿאַר אַ Three.js שפּיל. שטופּן צו GitHub, Vercel באַמערקן, בויט דעם פּראָיעקט, און גיט איר צוריק אַ URL אין 60 סעקונדעס. קיין סערווער צו צושטעלן, קיין דאָקער טעקע, קיין NGINX קאַנפיגיעריישאַן, קיין SSL באַשטעטיקן. די Three.js פּעקל איז נאָר סטאַטיק HTML, JS, און WebGL אַסעץ, וואָס איז פּונקט וואָס Vercel's עדזש נעץ איז געבויט צו דינען.

די פֿרייַ טיר קאָווערס אַ וויקענד קאַטער באַקוועם:

  • 100 גב באַנדווידט פּער חודש. אַ 5 מב Three.js בויען מיט 10,000 שפּילערייען איז 50 גב. איר וועט לויפן אויס פון וויקענד איידער איר לויפן אויס פון באַנדווידט.
  • אַנלימיטעד סטאַטיק דעפּלייז מיט HTTPS און אַ *.vercel.app סובדאָמעין.
  • קאַסטומער דאָומיין שטיצן אויף די פֿרייַ טיר - ברענג דיין אייגענע name-game.com אויב איר האָבן איינער, אַנדערש די פֿרייַ vercel.app URL איז ייַנטיילן אויף יעדן סאציאל פּלאַטפאָרמע.
  • פּרעוויו דעפּלייז פֿאַר יעדן קאַמיט - יעדן דרוק באקומט זיין אייגענע URL, אַזוי איר קען טיילן אַ בויען מיט אַ פרייַנד און פאָרזעצן צו יטערירן אָן צו ברעכן עס.

לייג אַ קונסט-געשטיצטע קוואַליטעט פון Vibe Skills און די באָילערפּלייט דיסאַפּירז אויך. Three.js סצענע באַשטעטיקן, שפּילער קאַנטראָלער, בויען פּייפּליין, און אַ Vercel-גרייט vercel.json זענען דזשענערייטאַד אין איין באַפֿעל. דעמאָלט Cursor פאַרוואַנדלט דעם רעשט פון די וויקענד אין אַ שמועס ווו איר באַשרייבן די שפּיל איר ווילט און טעמפּער די רעזולטאַט. דאָס איז דער גאַנצער סטאַק: אַ מאַרקפּלאַץ קוואַליטעט פֿאַר די יסוד, אַ קונסט רעדאַקטאָר פֿאַר יטעראַציע, און Vercel פֿאַר די דעפּלייַ. סאָלאָ, פֿרייַ, און שנעל.


ווי צו שיקן אַ 3 ד שפּיל אויף Vercel דעם אָפּרוטעג (מיט AI סקילס) - Vibe Skills preview
Vibe Skills
Vibe Skills

בלעטער הונדערטער פון רעדי-געמאכטע געניטקייטן פֿאַר Claude, Cursor, און מער.

די 48-שעהדיקע אַנאַטאָמי: פרייטיק קאָנסעפּט צו זונטיק דעפּלייַ

יעדן וויקענד שיף וואָס טאַקע גייט לעבן גייט דורך די זעלבע ביטן. דער קונץ איז צו פּלאַנירן די דעפּלייַ אויף פרייטיק, נישט זונטיק נאָכמיטאָג, אַזוי די לעצטע זעקס שעה גייען צו פּאָליש אַנשטאָט קאַמפּעטינג מיט אַ בויען טעות.

פאַסעצייט בלאָקוואָס איר טאָןוואָס איז שיפּט דורך דעם סוף פון פאַסע
פאַסע 1: קאָנסעפּטפרייטיק 6 אויפנ - 10 אויפנקלייַבן ז'אנר, שרייַבן 1-בלאַט פּלאַן דאָק, ינסטאַלל Vibe Skills 3 ד שפּיל קוואַליטעט, שטופּן סטאַרטער צו GitHub, פאַרבינדן צו Vercelלעבן name-game.vercel.app URL מיט די באָילערפּלייט סצענע
פאַסע 2: בויעןשבת 9 אויפנ - 8 אויפנפאַרבייַטן פּלאַץ-האַלטער מיט דיין קער מעקאַניק, לייגן 1 מדרגה, באַקומען געווינען/פאַרלירן שטאַט אַרבעטשפּילבאַר בויען בייַ דער זעלבער Vercel URL, אָטאָ-דעפּלייַט אויף יעדן דרוק
פאַסע 3: פּאָלישזונטיק 10 אויפנ - 4 אויפנגעזונט, זאַפט, טוטאָריאַל פּאָפּאַפּ, באַג פּאַס, פאָרשטעלונג טשעק אויף רירעוודיקאַ בויען וואָס ברעכט נישט אין די ערשטער 60 סעקונדעס אויף קיין מיטל
פאַסע 4: קאַטערזונטיק 4 אויפנ - 8 אויפנשטעלן קאַסטומער דאָומיין (אויספאַל), רעקאָרדירן GIF, שרייַבן itch.io בלאַט, פּאָסטן די לינקציבור URL + itch.io בלאַט + אַ קאַטער פּאָסטן אויף סאָושאַלז

דער סיבה וואָס דאָס אַרבעט איז דער פרייטיק דרוק צו Vercel. אַמאָל די URL יגזיסטירט, יעדן שבת און זונטיק קאַמיט דעפּלייז אויטאָמאַטיש. עס איז ניט קיין "זונטיק אויפנאַכט דעפּלייַ פּאַניק" ווייַל די דעפּלייַ שוין געשען אויף פרייטיק און איז ארבעטן אויף אַוטאָפּילאָט דעם גאַנצן וויקענד.


וואָס "ווייב קאָדירונג" אַ 3 ד שפּיל אויף ווערסעל קוקט אויס

ווייב קאָדירונג מיינט באַשרייבן וואָס איר ווילט אין פּשוט ענגליש און לאָזן אַ קונסט רעדאַקטאָר שרייַבן דעם קאָד, דעמאָלט יטערירן אויף דעם רעזולטאַט. פֿאַר אַ Three.js שפּיל אויף Vercel, די לופּ איז אַנוואָרמאַל קלאָר: יעדן ענדערונג אין Cursor איז אַ pnpm dev אַוועק פון היגע פידבאַק, דעמאָלט אַ git push אַוועק פון אַ לעבן פּרעוויו URL, דעמאָלט אָטאָ-דעפּלייַט צו פּראָדוקציע אויף main.

אַ ווייב-קאָדעד Vercel שפּיל וויקענד קוקט אַזוי:

  1. עפֿענען די קוואַליטעט ס סטאַרטער פאָלדער אין Cursor.
  2. באַשרייבן אַ שטריך אין שמועס: "טאָפּל שפּרינגען אויב פּלאַץ איז דריקט צוויי מאָל אין 200ms".
  3. Cursor עדיט די קאָנטראָללער טעקע. ראַטעווען. pnpm dev רילאָודז. איר פילן דעם שפּרינג אין דעם בלעטערער.
  4. אויב עס פילט ריכטיק, git push. Vercel בויען אַ פּרעוויו URL. שיקן עס צו אַ פרייַנד.
  5. צונויפגיסן צו main ווען די געפיל איז געשלאָסן. פּראָדוקציע URL אַפּדייטס אין 60 סעקונדעס.

די קונסט טוט די טיפּינג. Vercel טוט די דעפּלייַ. איר טאָן די געפיל און די פּלאַן.


5 קונסט 3 ד שפּיל קוואַליטעטן וואָס מאַכן דאָס מעגלעך אויף Vibe Skills

די קוואַליטעטן זענען געבויט פֿאַר די Vercel + Three.js + Cursor וויקענד ווערקפלאָו. יעדער איינער שיפּט מיט אַ Vite-באזירט Three.js פּראָיעקט, אַ אַרבעטנדיק vercel.json, אַ pnpm build וואָס פּראָדוצירט אַ סטאַטיק פּעקל Vercel קען דינען פון דעם עדזש, און אַ טעסטעד דעפּלייַ וועג. אַלע זענען אין די 3 ד שפּילן קאַטעגאָריע אויף Vibe Skills.

1. Three.js + Vercel שפּיל סטאַרטער

די פעליקייַט ברירה. דזשענערייט אַ Three.js סצענע מיט אַ שפּילער קאַנטראָלער, דריט-מענטש קאַמעראַ, ליכט ריג, הימל-באָקס, און אַ ערד פלאַך מיט קאַליזשאַנז. שיפּט מיט אַ vercel.json וואָס שטעלט די רעכט קאַטשינג קעפ פֿאַר Three.js אַסעט פּעקאַלז. pnpm dev לויפט לאָקאַל; איינער גיט אין די Vercel דאַשבאָרד פאַרבינדט די GitHub רעפּאָ און איר האָבן אַ לעבן URL.

בעסט פֿאַר: קיין ז'אנר אַחוץ ריין 2 ד. ניצן דאָס אויב איר נאָך נישט וויסן וואָס איר בויען.

2. ערשטער-מענטש Vercel וואַקער

אַ פּאָלירטער ערשטער-מענטש קאַנטראָלער (WASD + מויז פּוינטער שלאָס + גראַוויטי + ספּרינט + שפּרינגען) מיט פֿיס-געזונט האָקן, קאָפּ-באַב, און אַ vercel.json וואָס האַנדלט די פּוינטער-שלאָס קספּ קעפ ריכטיק. דאָס שטומפּלט פילע סאָלאָ דעוועלאָפּערס אין פּראָדוקציע. די קוואַליטעט סאַלווז עס פֿאַר איר.

בעסט פֿאַר: גיין סימס, גרויל פּראָטאָטיפּס, דערציילונג שפּילערייען, מוזיי עקספּאָזיציעס.

3. בלעטערער אַרענאַ שיסער קיט

אַ שפּיץ-אַראָפּ אַרענאַ (טאָפּל-שטאַם קאַנטראָלער, כוואַליע ספּאַוונער, באַסיק פייַנט קונסט, פּרויעקטיל סיסטעם, כעזשבן HUD) מיט אַ Vercel-טונעד בויען וואָס גיפּס אַסעץ, קאָד-שפּאַלטן די קונסט, און פויל-לאָודז מוזיק. מולטיפּלייער האָקן אַרייַנגערעכנט; דער וויקענד שיפּט איין-שפּילער.

בעסט פֿאַר: אַרקאַדע שיסערייען, בולעט בייַגעלאַגער, דזשאַם איינסן וואָס דאַרפֿן צו לאָדן שנעל אויף רירעוודיק.

4. Vercel פּאַזל פּלאַטפאָרמער

אַ דריט-מענטש פּלאַטפאָרמער (באַרגאַנג שפּרינגען, קאָיאָטע צייט, לעדזש דעטעקציע), טשעקפּוינטס, דריי סטוב לעוועלס איר קען עדיטירן אין בלענדער אָדער אין קאָד, און אַ ריספּאָן לופּ. די vercel.json איז קאָנפיגורירט פֿאַר גלייכע עדזש-קאַטשט לעוועל רילאָודז, אַזוי שפּיל-טעסטינג פילט שנעל אויף אַ טעלעפאָן.

בעסט פֿאַר: פּאַזל פּלאַטפאָרמערס, פּאַרקאָר פּראָטאָטיפּס, לעוועל-פּלאַן עקספּערימענטן.

5. Vercel דרייווינג סאַנדבאָקס

אַרקאַדע דרייווינג געפיל (אַקסעלעריישאַן קורווע, דריפֿט פיזיק, קאַמעראַ פאַרטשעפּן, באַסיק טעריין) מיט אַ נידעריק-פּאָלי קאַר, אַ טראַק טעמפּלאַטע, און אַ דעפּלייַ טונד פֿאַר גרויס טעריין מעשיז. פּרעסעט HTTP קעפ מאַכן די WebGL קאָנטעקסט אָנהייבן פאַסטער אויף סאַפאַרי, היסטאָריש די סלאָוועסט בלעטערער פֿאַר Three.js.

בעסט פֿאַר: אַרקאַדע רייסינג, אַוועק-וועג דרייווינג, קאַר-געפיל דעמאָס פֿאַר אַ פּאָרטפאָליאָ.

בלעטער אַלע 3 ד שפּיל קוואַליטעטן אויף Vibe Skills →


פרייטיק-צו-זונטיק שריט-פֿאַר-שריט

דאָס איז די פּינקט סקעדזשול. אַדזשוסטירן די אָנהייב צייט, אָבער האַלטן דעם סדר. דער הויפּט מיילסטאָן איז דער פרייטיק-אויפנאַכט Vercel דעפּלייַ. אַלע וואָס נאָך דעם איז יטעראַציע.

פרייטיק 6 אויפנ - 8 אויפנ: קלייַבן קוואַליטעט, שטופּן צו GitHub, פאַרבינדן Vercel

שריט 1: קלייַבן אַ 3 ד שפּיל קוואַליטעט אויף Vibe Skills. בלעטער די 3 ד שפּילן קאַטעגאָריע, קלייַבן די וואָס פּאַסט דיין ז'אנר, און ינסטאַלל די סטאַרטער אין אַ פריש פאָלדער. עפֿן עס אין Cursor. איר זאָל זען אַ Three.js סצענע מיט אַ מאָווינג שפּילער דורך 7 אויפנ.

שריט 2: שאַפֿן אַ GitHub רעפּאָ און שטופּן. git init, git remote add, git push. ניצן דעם שלאָג פון דיין שפּיל ווי די רעפּאָ נאָמען (crystal-runner, lunar-fishing, וואָס איר ווילט). דער רעפּאָ נאָמען ווערט אָפט דיין URL.

שריט 3: פאַרבינדן דעם רעפּאָ צו Vercel. קלאָג זיך אין צו Vercel מיט GitHub (פֿרייַ), גיט "לייגן נייַע פּראָיעקט", קלייַבן דעם רעפּאָ. Vercel אָטאָ-דעטעקטס Vite און קאָנפיגורירט דעם בויען. גיט דעפּלייַ. אין 60 סעקונדעס איר האָבן אַ crystal-runner.vercel.app URL. עפֿן עס אויף דיין טעלעפאָן. טיילן מיט איין פרייַנד. די דעפּלייַ באַר איז איצט נול פֿאַר דעם רעשט פון די וויקענד.

פרייטיק 8 אויפנ - 10 אויפנ: שרייַבן דעם פּלאַן דאָק

שריט 4: ענטפערן פינף פראַגעס אין פּשוט ענגליש. עפֿן אַ נאָטיאָן בלאַט אָדער אַ מאַרקדאָוון טעקע אין די רעפּאָ און ענטפער:

  • וואָס טוט דער שפּילער טאָן יעדער 5 סעקונדעס? (דער קער לופּ)
  • וואָס איז דער געווינען צושטאַנד און דער פאַרלירן צושטאַנד?
  • ווי לאַנג איז איין לויפן אָדער איין מדרגה?
  • וואָס איז די וויזואַל האָק? (פּאַליטע, ליכט, סטיל רעפערענץ)
  • וואָס איז דער איינער שטריך וואָס מאכט דאָס מעמעראַבאַל אין 30 סעקונדעס?

שריט 5: קאַמיט דעם פּלאַן דאָק. שטופּן עס צו דעם רעפּאָ. Vercel וועט רעדעפּלייַ. די דיסציפּלין פון דרוקן יעדן באַטייַטיק ענדערונג האלט די לעבן URL ערלעך.

שבת 9 אויפנ - 1 אויפנ: בויען דעם קער מעקאַניק

שריט 6: פאַרבייַטן דעם פּלאַץ-האַלטער מעקאַניק מיט דיין איין שטריך. דאָס איז דער איינציקער שטריך וואָס איז וויכטיק. ניצן Cursor שמועס צו באַשרייבן עס ("ווען דער שפּילער נעמט אַ קריסטאַל, פרירן שכיינע פייַנטלעך פֿאַר 2 סעקונדעס און שפּיל אַ טשיימ"). יטערירן לאָקאַל מיט pnpm dev. ווען עס פילט ריכטיק, שטופּן.

שריט 7: דראָט די געווינען/פאַרלירן שטאַט. אַ 60-סעקונדיקע בויען מיט אַ פאַקטיש סוף פילט ווי אַ שפּיל. אַ 60-מינוטיקע בויען אָן אַ סוף פילט ווי אַ טעק דעמאָ. שטענדיק דראָט די געווינען סקרעען ערשטער, דעמאָלט אַלץ אַנדערש.

שבת 1 אויפנ - 8 אויפנ: לייגן איין מדרגה

שריט 8: בויען איין פּאָלירטער מדרגה. נישט דריי האַלב-געבאַקענע. ניצן פּלאַץ-האַלטער קיובס פֿאַר דזשיאַמאַטרי. ניצן דעם קוואַליטעט ס סטאַק כאַראַקטער. טעמפּער געפיל - שפּרינג הייך, קאַמעראַ פאַרטשעפּן, פּאַרטאַקאַל ינטענסיטי.

שריט 9: לייגן אַ טוטאָריאַל אָווערליי. אַ צוויי-קליין "WASD צו רירן, גיט צו שיסן" פּאָפּאַפּ אויף ערשטער קאַטער ראַטעוועט דיין קאַטער פון צעמישט שפּילערס וואָס געבן אַרויף אין 8 סעקונדעס. Cursor קען דזשענערייט די רעאַקט (אָדער וואַניל DOM) אָווערליי אין 30 סעקונדעס.

שריט 10: שטופּן יעדער שעה. יעדן דרוק באקומט אַ Vercel פּרעוויו URL. שיקן יעדן איינער צו אַ פרייַנד. דער פידבאַק לופּ איז די סוד געצייַג פון דעם סטאַק.

זונטיק 10 אויפנ - 4 אויפנ: פּאָליש

שריט 11: לייגן דריי געזונט. פֿיס-געזונט לופּ, אַמביאַנט פּאַד, געווינען שטאַמ. אפילו דריי געזונט הייבן אַ וויקענד פּראָטאָטיפּ דראַמאַטיש. פֿרייַ מקורים: freesound.org, opengameart.org.

שריט 12: לייגן זאַפט. פּאַרטאַקאַלז אויף שלאָגן, עקראַן שאָקלען אויף השפּעה, נומער פּאָפּאַפּס אויף כעזשבן. זאַפט איז וואָס מאכט אַ 48-שעהדיקע בויען קוקן ווי אַ 6-חודש איינער אין אַ GIF. פרעגן Cursor צו לייגן אַ "עקראַן שאָקלען פון ינטענסיטי 0.3 פֿאַר 150ms ווען דער שפּילער נעמט שעדיקן" - עס וועט שרייַבן די קאַמעראַ-שאָקלען האָק אין פינף סעקונדעס.

שריט 13: לויפן אַ לייטהאָוס פּאַס. עפֿן די Vercel URL אויף אַ טעלעפאָן און לויפן קראָום דעוועלאָפּער געצייַג לייטהאָוס. Three.js פּעקאַלז זענען יוזשאַוואַלי אַרום 400 קב צו 1.5 מב. אויב איר זענט איבער 3 מב, פרעגן Cursor צו ענייבאַל קאָד-שפּאַלטן אויף די שווערע מאָדולעס. Vercel's גיזשאַפּ און בראָטלי וועט האַנדלען דעם רעשט.

שריט 14: באַג פּאַס. שפּיל דיין לעבן URL פינף מאָל אין אַ רודערן. פאַרריכטן אַלץ וואָס ברעכט צוויי מאָל. איגנאָרירן אַלץ וואָס ברעכט איין מאָל.

זונטיק 4 אויפנ - 8 אויפנ: קאַטער

שריט 15: (אויספאַל) שטעלן אַ קאַסטומער דאָומיין. אויב איר האָט געקויפט אַ name-game.com פריער, לייגן עס אין Vercel's פּראָיעקט סעטטינגס. SSL איז אויטאָמאַטיש. אַנדערש די *.vercel.app URL איז גוט - עס האט HTTPS, עס איז ייַנטיילן, און עס לאָודז אומעטום.

שריט 16: רעקאָרדירן אַ 15-סעקונדיקע GIF פון דער בעסטער מאָמענט. ניצן די לעבן URL, נישט לאָקאַלהאָסט. די GIF איז וואָס באקומט קליקס אויף טוויטער, בלוסקי, און רעדדיט.

שריט 17: שאַפֿן אַ itch.io בלאַט (אויספאַל אָבער הויך-לעוועראַזש). טיטל, איין-שורה טאַגליניע, דריי סקרעענשאָטס, די GIF, קאָנטראָלן, קרעדיטן, און אַ עמבעד פון דיין *.vercel.app iframe (itch.io שטיצט iframe עמבעדס פֿאַר HTML5 שפּילערייען). איצט איר האָבן צוויי URLs - איינער פֿאַר גלייַכגילטיק ייַנטיילן און איינער פֿאַר די גיימער וילעם.

שריט 18: פּאָסטן די לינק. טוויטער, בלוסקי, דיין דעוועלאָפּער קהל דיסקאָרד, ר/ינדידעוו, ר/threejs, ר/וועבגאַמעס. שטענדיק פירן מיט די GIF. שטענדיק אַרייַננעמען די URL. אויב איר האָט געוויינט אַ Vibe Skills קוואַליטעט, דערמאָנען עס אין דעם דעוועלאָפּער לאָג פּאָסטן - אנדערע דעוועלאָפּערס וואָס לייענען צוזאַמען וועלן וועלן דעם זעלבן סטאַרטער.


ווי צו ויסמיידן די דריי מערסט פּראָסטע ווערסעל דעפּלייַ דורכפאַלן

דריי זאַכן ברעכן כּמעט יעדן סאָלאָ Three.js + Vercel וויקענד. אַלע דריי זענען 5-מינוט פיקס אויב איר כאָטש זיי אויף פרייטיק אויפנאַכט, און 5-שעהדיקע קיניגל האָלעס אויב איר אַנטדעקן זיי אויף זונטיק בייַ 7 אויפנ.

  • פאַלש בויען רעזולטאַט וועגווייַזער. Vite פעליקייט איז dist/. Vercel אָטאָ-דעטעקטס Vite און ניצט dist/. אויב איר האָט קאַסטאַמייזד דעם רעזולטאַט, שטעלן outputDirectory אין vercel.json אָדער די פּראָיעקט סעטטינגס אָדער דיין דעפּלייַ וועט זיין אַ 404.
  • אַסעט פּאַטס וואָס אַרבעט לאָקאַל אָבער 404 אין פּראָדוקציע. ניצן שייַעך-פּאַטס אָדער די Vite import.meta.env.BASE_URL העלפּער פֿאַר קיין ראַנטייַמע-לאָודיד GLB, טעקסטשער, אָדער אַודיאָ טעקע. האַרדקאָדעד /assets/... פּאַטס יוזשאַוואַלי אַרבעט, אָבער קאָפּי-פּייסט גאַנץ ווינדאָוז פּאַטס וועלן אַבסאָלוט נישט.
  • קספּ קעפ וואָס בלאָקירן פּוינטער שלאָס אָדער אַודיאָ קאָנטעקסט. ערשטער-מענטש שפּילערייען דאַרפן פּוינטער שלאָס. אַודיאָ דאַרף באַניצער-געשעעניש אַקטיוויישאַן. קיין קוואַליטעט פון די 3 ד שפּילן קאַטעגאָריע שיפּט מיט די רעכט headers בלאָק אין vercel.json צו האַנדלען דעם. אויב איר האָט געשריבן דיין אייגענע פון ​​שראַטש, קאָפּי די קאַנפיגיעריישאַן פון די קוואַליטעט ס רעפּאָ.

דער דעפּלייַ אַרבעט אויף פרייטיק, אַזוי ווען די ברעכן אויף זונטיק איז עס שטענדיק צוליב אַ פרישע ענדערונג. git bisect איז דיין פרייַנד. אפילו בעסער: פאָרזעצן צו שטופּן יעדן 30 מינוט אַזוי אַז דער צעבראָכן קאַמיט איז קליין.


אָפט געשטעלטע פראגעס

וועט די ווערסעל פֿרייַ טיר טאַקע האַלטן אויב מיין שפּיל באקומט פאַרקער?

יא פֿאַר אַ וויקענד קאַטער און די ערשטע ביסל וואָכן. די פֿרייַ טיר גיט איר 100 גב באַנדווידט פּער חודש, וואָס איז אַפּפּראָקס. 20,000 שפּילערייען פון אַ 5 מב Three.js בויען. אויב איר שלאָגן דעם סטעליע, די פּראָ פּלאַן איז $20/חודש און באַזעצט איר צו 1 טב. פֿאַר אַ וויקענד שיף, פֿרייַ איז מער ווי גענוג. קוואַליטעטן אויף Vibe Skills שיפּט מיט בויען קאַנפיגז וואָס מינאַמייז פּעקל גרייס, וואָס יקספּאַנדז די פֿרייַ טיר ווייַטער.

קען איך נוצן אַ קאַסטומער דאָומיין אויף די פֿרייַ ווערסעל טיר?

יא. די פֿרייַ טיר שטיצט קאַסטומער דאָומיינס מיט אָטאָמאַטיש HTTPS. קויפֿן אַ דאָומיין (Namecheap, Cloudflare Registrar, Porkbun), פֿאַרבינדן עס צו Vercel, און Vercel וועט האַנדלען דעם SSL סערטיפיקאַט. די באַשטעטיקן נעמט וועגן 10 מינוט. אויב איר האָט נישט אַ דאָומיין, די name-game.vercel.app URL איז קורץ גענוג צו טיילן אויף קיין פּלאַטפאָרמע.

איז דער סטאַק גוט פֿאַר אַ שפּיל דזשאַם סובמישאַן?

יא, און עס איז איינער פון די בעסטע סטאַקס פֿאַר דזשאַם סובמישאַנז. רובֿ דזשאַמס (Ludum Dare, GMTK, js13k, GitHub Game Off) אָננעמען קיין וועב-שפּילבאַר URL. אַ *.vercel.app לינק אַרבעט פּונקט ווי אַ itch.io URL פֿאַר ריכטער. פילע דזשאַם ווינערז שיפּן צו ביידע - itch.io פֿאַר די גיימער וילעם, Vercel ווי די שנעל קאַנאָניקאַל URL.

דאַרף איך וויסן Three.js איידער איך אָנהייבן?

איר דאַרפֿן גענוג דזשאַוואַסקריפּט צו לייענען וואָס Cursor שרייבט און טעמפּער וואַלועס. איר טאָן ניט דאַרפֿן צו שרייַבן Three.js פון שראַטש. די קוואַליטעטן אויף Vibe Skills דזשענערייט די מאָטאָר סעטטינגס, קאַמעראַ, קאַנטראָלער, און בויען קאָנפיג. Cursor האַנדלט דעם שפּיל קאָד פון דיין באַשרייבן.

וואָס פּאַסירט אויב מיין ווערסעל בויען דורכפעלט אויף זונטיק בייַ 7 אויפנ?

דער מערסט פּראָסט סיבה איז אַ טייפּסקריפּט טעות אָדער אַ פעלנדיק סוויווע בייַטעק. Vercel ווייזט דעם בויען קלאָץ מיט די דורכפאַלן שורה אונטערגעשטראָכן. איינער גיט אין די דאַשבאָרד ראָלס צוריק צו די לעצטע ארבעטן דעפּלייַ און פּראָמאָטירט עס צו פּראָדוקציע. ווייַל יעדן דרוק איז אַ פּרעוויו דעפּלייַ, איר זענט קיינמאָל מער ווי איין קאַמיט פון אַ ארבעטנדיק בויען. דאָס איז וואָס דרוקן יעדן 30 מינוט אויף שבת און זונטיק איז וויכטיק.

קען איך פאַרקויפן אָדער מאָדיפיצירן דעם קאָד פון אַ Vibe Skills 3 ד שפּיל קוואַליטעט?

יא. קוואַליטעטן אויף Vibe Skills שיפּט מיט אַ קאַמערשאַל-פרייַנדלעך דערלויבעניש וואָס גיט איר צו מעלדן דעם קאָד אין דיין אייגענע שפּיל אויף Vercel, itch.io, Steam, אָדער ערגעץ אַנדערש. קרעאַטאָרס האַלטן די IP פון די קוואַליטעט, איר האַלטן די IP פון די שפּיל געבויט אויף שפּיץ.

וואָס אויב איך וויל נישט נוצן Cursor?

קיין קונסט רעדאַקטאָר וואָס קען עדיטירן פּראָיעקט טעקעס אַרבעט. Claude Code, Cursor, Windsurf, GitHub Copilot Chat, Cline - קיין פון זיי קען יטערירן אויף די Three.js סקאַפאָלדינג פון אַ Vibe Skills קוואַליטעט. די קוואַליטעט זיך איז רעדאַקטאָר-אַגנאָסטיק.


שיקן עס דעם וויקענד

דער סיבה וואָס רובֿ סאָלאָ דעוועלאָפּערס קיינמאָל שיקן אַ 3 ד שפּיל איז נישט דער מאָטאָר, דער ז'אנר, אָדער די קוואַליטעט קאַפּ. עס איז דער פרייטיק אויפנאַכט ווען זיי "נאָר פאָרשן אַ ביסל מער" און קיינמאָל אָנהייבן. דער ווייַטער פֿרייַ וויקענד איר האָבן, נאָכגיין די פיר-פאַסע פּלאַן: ינסטאַלל אַ Vibe Skills 3 ד שפּיל קוואַליטעט, שטופּן צו GitHub, פאַרבינדן Vercel, דעפּלייַ דורך פרייטיק 8 אויפנ, דעמאָלט פאַרברענגען שבת און זונטיק יטערירן אויף אַ לעבן URL.

דיין פּאָרטפאָליאָ פון צען וויקענד-שיפּט שפּילערייען אויף Vercel איז ווערט מער ווי דיין היפּאָטעטיש זעקס-חודש חלום מאָטאָר פּראָיעקט. דער שיפּט איינער שטענדיק ווינס. די פֿרייַ ווערסעל URL איז די באַווייַז.

בלעטער 3 ד שפּיל קוואַליטעטן אויף Vibe Skills →


היט די Three.js באָילערפּלייט מאַראַטאָן. ינסטאַלל אַ 3 ד שפּיל קוואַליטעט אויף Vibe Skills, שטופּן צו Vercel, און האָבן אַ לעבן URL דורך זונטיק אויפנאַכט.

ווי צו שיקן אַ 3 ד שפּיל אויף Vercel דעם אָפּרוטעג (מיט AI סקילס) - Vibe Skills preview
Vibe Skills
Vibe Skills

בלעטער הונדערטער פון רעדי-געמאכטע געניטקייטן פֿאַר Claude, Cursor, און מער.