רוצים לבנות משהו מהנה? להלן רשימה של רעיונות לדוגמה לאפליקציות אינטרנט.

מעוניין ללמוד JavaScript? קבל את הספר האלקטרוני שלי בכתובת jshandbook.com

אם אתה קורא את הפוסט הזה, אתה כנראה מחפש רעיון. סביר להניח שתרצה לבנות אפליקציה פשוטה שתוכל להשתמש בה בהדרכה או בפרויקט לדוגמה שלך כדי לבדוק מסגרת חדשה או API. אבל אתה לא יכול למצוא שום דבר שבאמת מהדהד איתך.

זה צריך להיות פשוט מספיק כדי לא לקחת את כל זמנך, אך יחד עם זאת מורכב מספיק כדי שיהיה שווה לעשות.

"אני לא רוצה לבנות אפליקציית מטלות נוספת!" אני שומע אותך חושב.

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

מה תמצא למטה

חלק מהרעיונות הם עצמאיים (אינם כוללים שימוש בממשק API חיצוני), בעוד שחלקם משתמשים בממשקי API ציבוריים מפורסמים בהם תוכלו לתפוס בקלות נתונים שנבנו מראש.

חלקם דורשים חלק בשרת, וחלקם לא, מה שעשוי להיות תלוי ביישום שלך.

אבל ניסיתי לוודא שהרעיונות האלה הם:

  • טוב להדרכה
  • טוב להתנסות בטכנולוגיות אינטרנט
  • לא משהו שייקח שבוע להבין
  • לא "רעיונות הפעלה"
  • ממוקד לאפליקציות אינטרנט
  • קל להסביר
  • קל לבנייה (פחות מ 24 שעות, אם מוכנים)
  • קל להרחבה באמצעות תכונות חדשות

אז די די, הנה הרשימה!

אפליקציות פשוטות ללא תלות חיצונית

אפליקציה למעקב אחר משקל

  • הוא מקבל סט ערכים ידניים של מדידות משקל שנלקחו בתאריכים שונים
  • זה יכול לשרטט גרף
  • זה יכול לאפשר לך לעקוב אחר ישויות מרובות, למשל יותר ממשקל של אדם אחד
  • זה מאחסן את המשקולות איפשהו

אפליקציית מחשבון

  • מחשבון רגיל: מספרים, +, -, *, /, והתוצאה

מאגר ספרים

  • הזן את הספרים שבבעלותך
  • הזן את הספרים שתרצה לקנות
  • אחסן את פרטי הספר ותמונותיו

אפליקציית מתכונים

  • הזן שם ותיאור עם השלבים
  • יש תמונות
  • יש דירוג כלשהו על קושי ואיכות
  • הוסף את הזמן הדרוש
  • ערכו שלבים שונים עם תמונה לכל אחד
  • אחסן אותם איפשהו

גשש הצעות חוק

  • רישום חשבונות, סכומים ותאריכים
  • רשום שטרות
  • יש כמה גרפים (השנה / השנה שעברה)
  • אחסן אותם איפשהו

גשש הוצאות

  • רישום הוצאות ותייג אותן (או יש קטגוריות)
  • רשום הוצאות
  • יש כמה גרפים (בחודש שעבר / בשנה שעברה)
  • אחסן אותם איפשהו

אפליקציית צ'אט

  • איזשהו רפוי מוסלק
  • אנשים נכנסים ללא אימות ומקצים להם שם, המאוחסן למועד חזרתם
  • אחסן את ההיסטוריה
  • הוסף התראות

אפליקציית הערות

  • הוסף הערה חדשה
  • רשום את כל ההערות שלך בסרגל הצד
  • אחסן אותם איפשהו

אפליקציית יומן אישית

  • הוסף ערכים עם תאריך וטקסט
  • הראה קודם יותר לאחרונה
  • צרף תמונות
  • אחסן אותם איפשהו

אפליקציית pomodoro

  • הזן שעה
  • הפעל טיימר
  • התראה כשנגמר הזמן

מחולל ממים

  • יש 10 תמונות מם פופולריות
  • תן למשתמש להוסיף את הטקסט
  • התוצאה היא תמונה + טקסט
  • אחסן את ההיסטוריה

משחק טיק טק-טו

כולנו יודעים מהו משחק טיק טק-טו?

משחק החיים

פרויקט נהדר שכולל מתמטיקה וגרפיקה.

מנוע בלוג

  • אפשר למשתמש להתחבר ולהוסיף פוסטים
  • המבקרים יכולים להוסיף הערות
  • אחסן את הנתונים איפשהו

מנוע QA

  • אפשר למשתמש להתחבר
  • הוסף שאלות
  • תשובה לשאלות
  • אפשר למשתמש המקורי לבחור את השאלה הטובה ביותר
  • אחסן את הנתונים איפשהו

מנוע פורום

  • אפשר למשתמש להתחבר
  • הוסף פוסטים
  • התייחסו לפוסטים
  • אחסן את הנתונים איפשהו

צ'אט בשידור חי לשיר

תחשוב על אינטרקום או אולארק.

  • שיהיה לך "backend" שבו אתה מגיב
  • הטמע בדף אינטרנט
  • תן לאנשים לכתוב לך באופן פרטי

אפליקציות המופעלות על ידי API

לקוח Hacker News

  • רשום את ההודעות הפופולריות
  • הציגו תגובות של פוסט
  • הראה פרופיל משתמש
  • חפש ב- HN

בדוק את HNPWA ו- Awesome Hacker News לקבלת השראה.

לקוח Reddit

  • רשום את ההודעות הפופולריות
  • רשום את הערות הפוסט
  • הראה פרופיל משתמש

לקוח אינסטגרם

  • הכנס hashtag וקבל את ההודעות האחרונות
  • הזן שם משתמש וקבל את ההודעות האחרונות
  • אפשר לאחסן hashtags / שם משתמש אחד או יותר ולקבל את כל ההודעות האחרונות מאלה

לקוח API של GitHub

  • רשום את המאגרים הפופולריים מהיום / שבוע / חודש
  • רשום את ההתחייבויות האחרונות במאגר
  • הראה לאדם או לארגון מאגרים ציבוריים המדורגים לפי כוכבים

לקוח API של Unsplash

  • חפש תמונות לפי נושאים
  • תן למשתמש להזין מונח, להציג תמונות רלוונטיות

התחל ב- Unsplash API לקבלת השראה.

נתונים עבור היישומים לדוגמה שלך

לפעמים אתה מתחיל לבנות איזו אפליקציה פשוטה, אבל אתה משועמם מהנתונים שמצאת שאתה יכול להשתמש בהם. אתה לא צריך להיות משועמם! אתה יכול להשתמש בנתונים אמיתיים, או בנתונים אקראיים.

ממשקי API ציבוריים שבהם תוכלו להשתמש בפרויקטים לדוגמא

אולי יש לך רעיון לאפליקציית CRUD נחמדה לחלוטין, או למשהו שעובד עם ממשק API, אבל אתה לא רוצה ליצור את ה- API מלכתחילה.

אני ממליץ לך לבדוק את Airtable, המספק ממשק API נהדר למפתחים. זה קל מאוד לשימוש, כמו מסד נתונים.

הנה כמה ממשקי API ציבוריים מדהימים שבהם אתה יכול להשתמש:

  • ממשק ה- API של Cat
  • ממשק ה- API של הכלב
  • ממשק ה- API של צ'אק נוריס
  • F ** k כבוי כ- API של שירות
  • API לציטוטים
  • API לציטוטים
  • API של אבא בדיחות
  • ממשק ה- API של Spotify
  • ממשק ה- API של הניו יורק טיימס
  • ממשק ה- API של ויקיפדיה
  • ממשק ה- API של Wikidata
  • ממשק ה- API בינוני
  • ממשק API לציטוטים
  • ממשק ה- API של GoodReads
  • ממשק ה- API של Dribbble
  • ממשק ה- API של 500 פיקסלים
  • ממשק ה- API של Unsplash
  • ממשק ה- API של Giphy - קובצי GIF!
  • ממשק ה- API של Pixabay
  • שערי חליפין
  • ממשק API של צילומי מסך לאתר
  • ממשק ה- API של מילון אוקספורד
  • ממשק API של טכנולוגיות אתרים
  • ממשק ה- API של Mapbox
  • ממשק API למילים של Music מאת Genius
  • ממשק API למטא תגיות לאתר
  • ממשק ה- API של EventBrite
  • פרויקטים של קוד פתוח משתנים
  • ממשק ה- API של GitHub REST
  • ממשק ה- API של GitHub GraphQL
  • ממשק API של קודי QR
  • ממשק ה- API של StackExchange
  • מילים ומילים נרדפות
  • ממשק ה- API של Nasa
  • ממשק ה- API של SpaceX
  • ממשק ה- Hacker News API
  • ממשק ה- API של אינסטגרם
  • ממשק ה- API של Reddit
  • ממשק ה- API הרפוי
  • ממשק ה- API של טוויטר
  • ממשק ה- API של YouTube

מציין מיקום תמונות לפרויקטים לדוגמה שלך

  • Placeholder.com
  • Placekitten

מחוללי תמונות

אווטרים:

  • רובוהאש
  • אווטרים מקסימים
  • אווטרים של DiceBear (אומנות פיקסל)
  • לורם פיקסום

מחולל טקסט לדוגמא לפרויקטים לדוגמה שלך

לורם איפסום משעמם. לתבל את זה!

אם אתה מתעקש להשתמש ב- Lorem Ipsum, Loripsum הוא מחולל טוב.

נתונים מזויפים אחרים

ל- FakeJSON טונות של יכולות ייצור נתונים מזויפות.

ל- JSONPlaceholder פוסטים, הערות, תמונות, תוספים, משתמשים ואלבומים מזויפים, כולם מוכנים לצריכת REST.

זקוק לייצור נתונים מזויפים / שם משתמשים? בדוק שמות ממשק משתמש ומשתמש אקראי.

מסיימים

אני מקווה שרשימה זו תהיה מקיפה מספיק כדי להתאים לצרכים שלך!

תעשה חיים!

מעוניין ללמוד JavaScript? קבל את הספר האלקטרוני שלי בכתובת jshandbook.com