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)
Start creating Detail component and add route to ir 01f5ae9c4984f05d2dd01b593ccb58369d9968da antcalatayud 2018-04-25 08:08:47
Add link to home page when page not found eb3c30fc87eff524b43d4197d945da9d026e8502 antcalatayud 2018-04-25 07:53:08
Add routing and not found page 17718006b6c1f4090ae971d0338ea8cd8f4b93c5 antcalatayud 2018-04-24 15:41:27
disable pagination buttons when min/max reached a7459260589206aa9430fd9dba67aed2b175607c antcalatayud 2018-04-24 15:14:06
Manage next/prev pages onclick pagination 104663344877dc34bc9e3df9762bfad335578d99 antcalatayud 2018-04-24 15:09:52
Start pagination component a2600ed30feb02a9394d31215d1218d699371f62 antcalatayud 2018-04-24 14:47:05
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 01f5ae9c4984f05d2dd01b593ccb58369d9968da - Start creating Detail component and add route to ir
Author: antcalatayud
Author date (UTC): 2018-04-25 08:08
Committer name: antcalatayud
Committer date (UTC): 2018-04-25 08:08
Parent(s): eb3c30fc87eff524b43d4197d945da9d026e8502
Signing key:
Tree: 6c303c639732454afe842cdc1078b124bfb3b791
File Lines added Lines deleted
src/components/detail/Detail.css 47 0
src/components/detail/Detail.js 17 0
src/components/list/Table.js 9 4
src/index.js 2 0
File src/components/detail/Detail.css added (mode: 100644) (index 0000000..18674b0)
1 .Detail {
2 display: flex;
3 flex-direction: column;
4 align-items: center;
5 margin-top: 30px;
6 margin-bottom: 40px;
7 padding: 0 60px;
8 }
9
10 .Detail-heading {
11 font-size: 24px;
12 font-weight: 300;
13 }
14
15 .Detail-container {
16 width: 100%;
17 max-width: 400px;
18 margin-top: 30px;
19 padding: 40px 40px 0;
20 border-radius: 4px;
21 box-shadow: 0px 0px 40px 0px#1f364d;
22 }
23
24 .Detail-item {
25 margin-bottom: 50px;
26 }
27
28 .Detail-value {
29 border-radius: 20px;
30 background-color: #1f364d;
31 font-size: 14px;
32 padding: 8px 12px;
33 margin-left: 10px;
34 }
35
36 .Detail-title {
37 display: block;
38 color: #9cb3c9;
39 font-size: 12px;
40 font-weight: bold;
41 margin-bottom: 10px;
42 }
43
44 .Detail-dollar {
45 color: #9cb3c9;
46 margin-right: 6px;
47 }
File src/components/detail/Detail.js added (mode: 100644) (index 0000000..14ab892)
1 import React from 'react';
2 import './Detail.css';
3
4
5 class Detail extends React.Component {
6 constructor(props) {
7 super(props);
8 this.state = { };
9 }
10 render() {
11 return (
12 <div>Detail</div>
13 );
14 }
15 }
16
17 export default Detail;
File src/components/list/Table.js changed (mode: 100644) (index 4058820..09f8c7a)
1 1 import React from 'react'; import React from 'react';
2 2 import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
3 import { withRouter } from "react-router-dom";
3 4 import './Table.css'; import './Table.css';
4 5
5 6
6 7 const Table = (props) => { const Table = (props) => {
7 const { currencies, renderChangePercent } = props;
8 const { currencies, renderChangePercent, history } = props;
8 9
9 10 return( return(
10 11 <div className="Table-container"> <div className="Table-container">
 
... ... const Table = (props) => {
19 20 </thead> </thead>
20 21 <tbody className="Table-body"> <tbody className="Table-body">
21 22 {currencies.map((currency) => ( {currencies.map((currency) => (
22 <tr key={currency.id}>
23 <tr
24 key={currency.id}
25 onClick={() => history.push(`/currency/${currency.id}`)}
26 >
23 27 <td> <td>
24 28 <span className="Table-rank"> <span className="Table-rank">
25 29 {currency.rank} {currency.rank}
 
... ... const Table = (props) => {
51 55
52 56 Table.propTypes = { Table.propTypes = {
53 57 currencies: PropTypes.array.isRequired, currencies: PropTypes.array.isRequired,
54 renderChangePercent: PropTypes.func.isRequired
58 renderChangePercent: PropTypes.func.isRequired,
59 history: PropTypes.object.isRequired,
55 60 }; };
56 61
57 export default Table
62 export default withRouter(Table);
File src/index.js changed (mode: 100644) (index 4dee39d..b7a0cf7)
... ... import { BrowserRouter, Route, Switch } from 'react-router-dom';
4 4 import Header from "./components/common/Header"; import Header from "./components/common/Header";
5 5 import List from "./components/list/List"; import List from "./components/list/List";
6 6 import NotFound from "./components/notfound/NotFound"; import NotFound from "./components/notfound/NotFound";
7 import Detail from "./components/detail/Detail"
7 8 import './index.css' import './index.css'
8 9
9 10 const App = () => { const App = () => {
 
... ... const App = () => {
13 14 <Header/> <Header/>
14 15 <Switch> <Switch>
15 16 <Route path="/" component={List} exact /> <Route path="/" component={List} exact />
17 <Route path="/currency/:id" component={Detail} exact/>
16 18 <Route component={NotFound} /> <Route component={NotFound} />
17 19 </Switch> </Switch>
18 20 </div> </div>
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