Completed

Project for Web&Mobile App Developers

Build a front-end application that communicates with the server provided in this repository. You should use react js framework or angular atleast.

The application you will build is a very simple player management tool. The user should be presented with a list of players received from the server, and have the option to add new players and update/delete existing ones. Think CRUD

How to run the server

The server is a minimal HTTP-server exposing a REST-type API written using nodeJS and Express. You may alter the server code in any way you wish.

You will need to have nodeJS installed on your computer to run the server.

Open a terminal and run npm i && npm run start from the project root.

The server is now running on localhost:3000. You can test the server by going to http://localhost:3000/players in your browser.

The API is described in [login to view URL] within the project root.

These are some of the things we need

Easy, clean and readable code, no unnecessary complexity.

Usage of a component-based library/framework (react, angular, or similar).

Testable code (separation of concern, referential transparency).

Handling of asynchronous fetching of data from an API.

Do not reinvent the wheel :)

Display some CSS/styling skills.

[login to view URL]:

const cuid = require('cuid');

const express = require('express');

const bodyParser = require('body-parser')

const app = express();

/* Setup express middlewares */

[login to view URL]([login to view URL]());

[login to view URL](allowCorsMiddleware);

/* API */

[login to view URL]('/players', getPlayers);

[login to view URL]('/player/:id', getPlayer);

[login to view URL]('/player/:id', putPlayer);

[login to view URL]('/player', addPlayer);

[login to view URL]('/player/:id', deletePlayer);

/* Start server */

[login to view URL](3000, () => [login to view URL]('app listening on port 3000.'))

/* The mock 'database' */

let players = [

{ id: 'cjeodaus60000poul1g030oia', name: 'Richard Garfield' },

{ id: 'cjeodaus60001poule3wjdz1p', name: 'Gabe Newell' },

];

/* IMPLEMENTATION DETAILS */

/* Return a list of all players

* Example: localhost:3000/players

*/

function getPlayers(req, res) {

return [login to view URL](200).json(players).end();

}

/* Return a specific player based on id

* Example: localhost:3000/player/cjeodaus60000poul1g030oia

*/

function getPlayer(req, res) {

const id = [login to view URL];

const player = [login to view URL](p => [login to view URL] == id);

return player ? [login to view URL](200).json(player).end() : [login to view URL](404).end();

}

/* Add a new player to the list

* Example: localhost:3000/player

* Body: { "name": "Fresh Prince" } */

function addPlayer(req, res) {

const name = [login to view URL];

if (!name) {

return [login to view URL](401).end()

}

const newPlayer = { id: cuid(), name };

players = [...players, newPlayer];

return [login to view URL](201).json(newPlayer).end();

}

/* Delete a player from the list

* Example: localhost:3000/player/cjeodaus60000poul1g030oia

*/

function deletePlayer(req, res) {

const id = [login to view URL];

const removedPlayer = [login to view URL](p => [login to view URL] == id);

players = [login to view URL](p => [login to view URL] != id);

return [login to view URL](200).json(removedPlayer).end();

}

/* Edit an existing player in the list

* Example: localhost:3000/player/cjeodaus60000poul1g030oia

* Body: { "name": "Steve Urkle" }

*/

function putPlayer(req, res) {

const id = [login to view URL];

const name = [login to view URL];

if (!name) {

return [login to view URL](400).end();

}

players = [login to view URL](p => [login to view URL] == id ? { ...p, name } : p);

return [login to view URL](200).json([login to view URL](p => [login to view URL] == id)).end();

}

/* MISC */

/* Add CORS-headers to every request */

function allowCorsMiddleware(req, res, next) {

[login to view URL]("Access-Control-Allow-Origin", "*");

[login to view URL]("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");

next();

}

技能: Angular.js, node.js

查看更多: web and mobile app developers pakistan, web and mobile app developers, i am looking for mobile app developers and designers to partner with me for a share on the project, app solutions, mobile app development clients, app development company, yalantis, app solutions llc, how to get mobile app development projects, mobile app projects bid, mobile app solutions, node.js, angular.js, web mobile app developers, indian mobile app developers, mobile app developers wanted, iphone web mobile app launcher, web mobile app launcher, experienced mobile app developers, mobile app developers pakistan

关于此雇主:
( 2个评论 ) Stockholm, Sweden

项目ID: #16498250

授予:

$150 USD 在5天内
(1条评论)
2.8

5 威客就此工作平均出价 $136

GauravNargotra

Hi, I have reviewed job description and basis the same I am excited to confirm that I would be much interested in making available my services for the proposed position. I have extensive experience with Angular 更多

$88 USD 在10天内
(2条评论)
3.2
shefjain03

i have more than 5 years of experience in wordpress php mysql with responsive design and also have expertise in angular and node and ionic also [login to view URL] [login to view URL] http://www.staples. 更多

$100 USD 在10天内
(0条评论)
0.0
parsysmedia

Hi, we can take your job pertaining to Angular.js, node.js and start work immediately as per your requirement, please chat

$256 USD 在10天内
(0条评论)
0.0
Grisha97924

Hello Nice to meet you I am interested in ur project I have experience of React js , and anular, node I can satisfy ur demand We can discuss more in detail Thank you Best regards

$88 USD 在10天内
(0条评论)
0.0