34

How far can JavaScript take us?

 5 years ago
source link: https://www.tuicool.com/articles/hit/FrMbYrQ
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.

ZJjeeuJ.png!web

Built by Tanner Villarete

Connect with me on LinkedIn ! I'll be graduating soon ;)

How far can JavaScript take us?

Turns out, pretty dang far. This web app was my attempt at mimicking Apple's iOS music app, and I think I've come pretty close!

I'm in my fourth year of college, and it's been super cool to see how much I've improved and continue to improve all aspects of programming.

Backend API

The API is hosted on a Raspberry Pi, and it's kept private (but still accessible if you try) so that it doesn't get overloaded. If you're interested in building your own backend to plug into this tool, here's what my database and endpoints look like:

Database

There are six required columns:

name
artist
album
track
url
artwork
mysql> use music;

Database changed
mysql> desc tracks;
+------------+------------------+------+-----+---------+----------------+
| Field      | Type             | Null | Key | Default | Extra          |
+------------+------------------+------+-----+---------+----------------+
| id         | int(10) unsigned | NO   | PRI | NULL    | auto_increment |
| created_at | timestamp        | YES  |     | NULL    |                |
| updated_at | timestamp        | YES  |     | NULL    |                |
| name       | varchar(255)     | NO   |     | NULL    |                |
| artist     | varchar(255)     | NO   |     | NULL    |                |
| album      | varchar(255)     | NO   |     | NULL    |                |
| track      | int(11)          | NO   |     | NULL    |                |
| url        | varchar(255)     | NO   |     | NULL    |                |
| artwork    | varchar(255)     | NO   |     | NULL    |                |
+------------+------------------+------+-----+---------+----------------+
9 rows in set (0.05 sec)

API Endpoints

The backend is built with PHP using the Laravel ORM. I only needed a few API endpoints to get this working:

/albums
/album/{album}
/artists
/artist/{artist}

Feel free to reach out if you have questions!


About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK