antcalatayud / ReactCoin (public) (License: GPLv3) (since 2018-04-24) (hash sha1)
As seen on this course: https://udilia.com/courses/learn-react-by-building-a-web-app
Clone URLs: https://rocketgit.com/user/antcalatayud/ReactCoin ssh://rocketgit@ssh.rocketgit.com/user/antcalatayud/ReactCoin git://git.rocketgit.com/user/antcalatayud/ReactCoin
develop
List of commits:
Subject Hash Author Date (UTC)
Move Table to new component 685659283e5fcfb3391bbd7e0988669a4896546b antcalatayud 2018-04-24 14:23:39
Add eror message 925f3e3199546d80b90276d53bf3ca827313adab antcalatayud 2018-04-24 14:10:51
Add loadin component 54504e3ae117730f625f6c5acf1a10ce912c6146 antcalatayud 2018-04-24 14:05:36
Create currencies table a410655fa61df8653b5943cb9c853b04e48c7287 antcalatayud 2018-04-24 13:34:35
Move some conts outside 00686f6d20dcc806e20a3d7bfb745517c203dd54 antcalatayud 2018-04-24 13:00:43
Add AJAX request to list component 3dd5f784d209cc1cfeb22bbc93aaf2c871e2c69b antcalatayud 2018-04-24 12:29:22
Start creating list componet c8bc3d6bb9b4980e1305d401be2fe67c8933a7f8 antcalatayud 2018-04-24 10:31:23
Add logo eed8364675e78cfa795550bff03682d49a8ed115 antcalatayud 2018-04-24 10:23:07
Add styling 866cbbbc94ce81e8b8b6b88da9f86d2d4153e509 antcalatayud 2018-04-24 10:18:43
Create fist component and render App b713ed055b8691a0fd89792d136e0ef9ed86f07c antcalatayud 2018-04-24 10:11:22
Add init files d81df9e3d230bcb49f0bb31c43cffad97532d321 antcalatayud 2018-04-24 09:51:04
Initial commit 3c3626d89f221374c92ee04aed1eaa8616f3977e Antonio Calatayud 2018-04-24 09:03:03
Commit 685659283e5fcfb3391bbd7e0988669a4896546b - Move Table to new component
Author: antcalatayud
Author date (UTC): 2018-04-24 14:23
Committer name: antcalatayud
Committer date (UTC): 2018-04-24 14:23
Parent(s): 925f3e3199546d80b90276d53bf3ca827313adab
Signing key:
Tree: f6aeb9b6f047886c2d9577fa8c1fb349ab13f874
File Lines added Lines deleted
src/components/list/List.js 5 39
src/components/list/Table.js 57 0
File src/components/list/List.js changed (mode: 100644) (index 867b3fe..1fb2151)
... ... import React from 'react';
2 2 import { handleResponse } from '../../helpers'; import { handleResponse } from '../../helpers';
3 3 import { API_URL } from '../../config'; import { API_URL } from '../../config';
4 4 import Loading from '../common/Loading' import Loading from '../common/Loading'
5 import './Table.css';
5 import Table from './Table'
6 6
7 7 class List extends React.Component { class List extends React.Component {
8 8 constructor(props) { constructor(props) {
 
... ... class List extends React.Component {
58 58 } }
59 59
60 60 return ( return (
61 <div className="Table-container">
62
63 <table className="Table">
64 <thead className="Table-head">
65 <tr>
66 <th>Cryptocurrency</th>
67 <th>Price</th>
68 <th>Market Price</th>
69 <th>2H Change</th>
70 </tr>
71 </thead>
72 <tbody className="Table-body">
73 {currencies.map((currency) => (
74 <tr key={currency.id}>
75 <td>
76 <span className="Table-rank">
77 {currency.rank}
78 </span>
79 {currency.name}
80 </td>
81 <td>
82 <span className="Table-dollar">
83 $ {currency.price}
84 </span>
85 </td>
86 <td>
87 <span className="Table-dollar">
88 $ {currency.marketCap}
89 </span>
90 </td>
91 <td>
92 {this.renderChangePercent(currency.percentChange24h)}
93 </td>
94 </tr>
95 ))}
96 </tbody>
97 </table>
98 </div>
61 <Table
62 currencies={currencies}
63 renderChangePercent={this.renderChangePercent}
64 />
99 65 ); );
100 66 } }
101 67 } }
File src/components/list/Table.js added (mode: 100644) (index 0000000..4058820)
1 import React from 'react';
2 import PropTypes from 'prop-types';
3 import './Table.css';
4
5
6 const Table = (props) => {
7 const { currencies, renderChangePercent } = props;
8
9 return(
10 <div className="Table-container">
11 <table className="Table">
12 <thead className="Table-head">
13 <tr>
14 <th>Cryptocurrency</th>
15 <th>Price</th>
16 <th>Market Price</th>
17 <th>2H Change</th>
18 </tr>
19 </thead>
20 <tbody className="Table-body">
21 {currencies.map((currency) => (
22 <tr key={currency.id}>
23 <td>
24 <span className="Table-rank">
25 {currency.rank}
26 </span>
27 {currency.name}
28 </td>
29 <td>
30 <span className="Table-dollar">
31 $
32 </span>
33 {currency.price}
34 </td>
35 <td>
36 <span className="Table-dollar">
37 $
38 </span>
39 {currency.marketCap}
40 </td>
41 <td>
42 {renderChangePercent(currency.percentChange24h)}
43 </td>
44 </tr>
45 ))}
46 </tbody>
47 </table>
48 </div>
49 )
50 }
51
52 Table.propTypes = {
53 currencies: PropTypes.array.isRequired,
54 renderChangePercent: PropTypes.func.isRequired
55 };
56
57 export default Table
Hints:
Before first commit, do not forget to setup your git environment:
git config --global user.name "your_name_here"
git config --global user.email "your@email_here"

Clone this repository using HTTP(S):
git clone https://rocketgit.com/user/antcalatayud/ReactCoin

Clone this repository using ssh (do not forget to upload a key first):
git clone ssh://rocketgit@ssh.rocketgit.com/user/antcalatayud/ReactCoin

Clone this repository using git:
git clone git://git.rocketgit.com/user/antcalatayud/ReactCoin

You are allowed to anonymously push to this repository.
This means that your pushed commits will automatically be transformed into a merge request:
... clone the repository ...
... make some changes and some commits ...
git push origin main