Skip to content

Commit b4b9f8a

Browse files
TLucas97TLucas97
committed
README update
1 parent 4d98825 commit b4b9f8a

27 files changed

+953
-620
lines changed

‎README.md

+89-3
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,105 @@
1-
# dacxi_frontend_challenge
1+
<img src="./src/assets/dacxi-logo.png" alt="Sublime's custom image" style="margin-bottom: 1.5em" />
2+
3+
<h1>Dacxi Frontend Challenge</h1>
4+
5+
## Project functionalities
6+
7+
#### ● Displays current crypto price every 10 seconds
8+
9+
#### ● Displays current crypto prices from past 30 days
10+
11+
#### ● User can select which crypto he wants to see
12+
13+
#### ● The user can select which coin he wants to see the crypto price on
14+
15+
#### ● The user can filter the closest crypto price by inserting date and time
16+
17+
<br />
18+
19+
## You can use and test this project by clicking [here.](https://tlucas97.github.io/dacxi_frontend_challenge/)
20+
21+
<br />
22+
<br />
23+
24+
<div style="margin: 1em 0">
25+
<h1>Jest Coverage</h1>
26+
<img src="./src/assets/jest-test-coverage.png" alt="Sublime's custom image" style="margin-bottom: 1em" />
27+
28+
### To get test coverage use:
29+
30+
```
31+
npm run test
32+
```
33+
34+
</div>
35+
36+
<br />
37+
<br />
38+
39+
<div style="margin: 1em 0">
40+
<h1>Cypress Coverage</h1>
41+
<video width="1010" height="440" controls style="border: 3px solid black; margin-bottom: 1em">
42+
<source src="./src/assets/cypress-dacxi-tests.mp4" type="video/mp4">
43+
</video>
44+
45+
### To open cypress use:
46+
47+
```
48+
npm run cypress:open
49+
```
50+
51+
</div>
52+
53+
<br />
54+
<br />
55+
56+
# Resources used to build this project
57+
58+
#### [● Vue.js](https://vuejs.org/)
59+
60+
#### [● Vuetify](https://vuetifyjs.com/)
61+
62+
#### [● Tailwind CSS](https://tailwindcss.com/)
63+
64+
#### [● Vue Toastification](https://github.com/Maronato/vue-toastification)
65+
66+
#### [● Vue Apex Charts](https://apexcharts.com/docs/vue-charts/)
67+
68+
#### [● Axios](https://axios-http.com/ptbr/docs/intro)
69+
70+
#### [● Jest](https://jestjs.io/pt-BR/)
71+
72+
#### [● Testing Library](https://github.com/testing-library/vue-testing-library)
73+
74+
#### [● Cypress](https://www.cypress.io/)
75+
76+
#### [● Javascript](https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/)
77+
78+
#### [● HTML5](https://developer.mozilla.org/pt-BR/docs/Web/HTML)
79+
80+
#### [● CSS3](https://developer.mozilla.org/pt-BR/docs/Web/CSS/)
81+
82+
<br />
83+
<br />
84+
85+
# Project setup
286

3-
## Project setup
487
```
588
npm install
689
```
790

891
### Compiles and hot-reloads for development
92+
993
```
10-
npm run serve
94+
npm run dev
1195
```
1296

1397
### Compiles and minifies for production
98+
1499
```
15100
npm run build
16101
```
17102

18103
### Customize configuration
104+
19105
See [Configuration Reference](https://cli.vuejs.org/config/).

‎coverage/clover.xml

+153-100
Large diffs are not rendered by default.

‎coverage/coverage-final.json

+4-4
Large diffs are not rendered by default.

‎coverage/lcov-report/index.html

+25-25
Original file line numberDiff line numberDiff line change
@@ -23,30 +23,30 @@ <h1>All files</h1>
2323
<div class='clearfix'>
2424

2525
<div class='fl pad1y space-right2'>
26-
<span class="strong">72.6% </span>
26+
<span class="strong">77.3% </span>
2727
<span class="quiet">Statements</span>
28-
<span class='fraction'>387/533</span>
28+
<span class='fraction'>453/586</span>
2929
</div>
3030

3131

3232
<div class='fl pad1y space-right2'>
33-
<span class="strong">23.07% </span>
33+
<span class="strong">25% </span>
3434
<span class="quiet">Branches</span>
35-
<span class='fraction'>3/13</span>
35+
<span class='fraction'>3/12</span>
3636
</div>
3737

3838

3939
<div class='fl pad1y space-right2'>
40-
<span class="strong">25% </span>
40+
<span class="strong">27.27% </span>
4141
<span class="quiet">Functions</span>
42-
<span class='fraction'>3/12</span>
42+
<span class='fraction'>3/11</span>
4343
</div>
4444

4545

4646
<div class='fl pad1y space-right2'>
47-
<span class="strong">72.6% </span>
47+
<span class="strong">77.3% </span>
4848
<span class="quiet">Lines</span>
49-
<span class='fraction'>387/533</span>
49+
<span class='fraction'>453/586</span>
5050
</div>
5151

5252

@@ -80,17 +80,17 @@ <h1>All files</h1>
8080
</thead>
8181
<tbody><tr>
8282
<td class="file low" data-value="src"><a href="src/index.html">src</a></td>
83-
<td data-value="0" class="pic low">
84-
<div class="chart"><div class="cover-fill" style="width: 0%"></div><div class="cover-empty" style="width: 100%"></div></div>
83+
<td data-value="35.59" class="pic low">
84+
<div class="chart"><div class="cover-fill" style="width: 35%"></div><div class="cover-empty" style="width: 65%"></div></div>
8585
</td>
86+
<td data-value="35.59" class="pct low">35.59%</td>
87+
<td data-value="59" class="abs low">21/59</td>
8688
<td data-value="0" class="pct low">0%</td>
87-
<td data-value="59" class="abs low">0/59</td>
88-
<td data-value="0" class="pct low">0%</td>
89-
<td data-value="2" class="abs low">0/2</td>
90-
<td data-value="0" class="pct low">0%</td>
91-
<td data-value="2" class="abs low">0/2</td>
89+
<td data-value="1" class="abs low">0/1</td>
9290
<td data-value="0" class="pct low">0%</td>
93-
<td data-value="59" class="abs low">0/59</td>
91+
<td data-value="1" class="abs low">0/1</td>
92+
<td data-value="35.59" class="pct low">35.59%</td>
93+
<td data-value="59" class="abs low">21/59</td>
9494
</tr>
9595

9696
<tr>
@@ -99,13 +99,13 @@ <h1>All files</h1>
9999
<div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
100100
</td>
101101
<td data-value="100" class="pct high">100%</td>
102-
<td data-value="258" class="abs high">258/258</td>
102+
<td data-value="298" class="abs high">298/298</td>
103103
<td data-value="100" class="pct high">100%</td>
104104
<td data-value="0" class="abs high">0/0</td>
105105
<td data-value="100" class="pct high">100%</td>
106106
<td data-value="0" class="abs high">0/0</td>
107107
<td data-value="100" class="pct high">100%</td>
108-
<td data-value="258" class="abs high">258/258</td>
108+
<td data-value="298" class="abs high">298/298</td>
109109
</tr>
110110

111111
<tr>
@@ -125,17 +125,17 @@ <h1>All files</h1>
125125

126126
<tr>
127127
<td class="file medium" data-value="src/utils"><a href="src/utils/index.html">src/utils</a></td>
128-
<td data-value="61.72" class="pic medium">
129-
<div class="chart"><div class="cover-fill" style="width: 61%"></div><div class="cover-empty" style="width: 39%"></div></div>
128+
<td data-value="60.36" class="pic medium">
129+
<div class="chart"><div class="cover-fill" style="width: 60%"></div><div class="cover-empty" style="width: 40%"></div></div>
130130
</td>
131-
<td data-value="61.72" class="pct medium">61.72%</td>
132-
<td data-value="209" class="abs medium">129/209</td>
131+
<td data-value="60.36" class="pct medium">60.36%</td>
132+
<td data-value="222" class="abs medium">134/222</td>
133133
<td data-value="30" class="pct low">30%</td>
134134
<td data-value="10" class="abs low">3/10</td>
135135
<td data-value="33.33" class="pct low">33.33%</td>
136136
<td data-value="9" class="abs low">3/9</td>
137-
<td data-value="61.72" class="pct medium">61.72%</td>
138-
<td data-value="209" class="abs medium">129/209</td>
137+
<td data-value="60.36" class="pct medium">60.36%</td>
138+
<td data-value="222" class="abs medium">134/222</td>
139139
</tr>
140140

141141
</tbody>
@@ -146,7 +146,7 @@ <h1>All files</h1>
146146
<div class='footer quiet pad2 space-top1 center small'>
147147
Code coverage generated by
148148
<a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
149-
at 2022-11-04T23:28:26.684Z
149+
at 2022-11-05T21:04:09.215Z
150150
</div>
151151
<script src="prettify.js"></script>
152152
<script>

‎coverage/lcov-report/src/App.vue.html

+52-52
Original file line numberDiff line numberDiff line change
@@ -23,30 +23,30 @@ <h1><a href="../index.html">All files</a> / <a href="index.html">src</a> App.vue
2323
<div class='clearfix'>
2424

2525
<div class='fl pad1y space-right2'>
26-
<span class="strong">0% </span>
26+
<span class="strong">100% </span>
2727
<span class="quiet">Statements</span>
28-
<span class='fraction'>0/21</span>
28+
<span class='fraction'>21/21</span>
2929
</div>
3030

3131

3232
<div class='fl pad1y space-right2'>
33-
<span class="strong">0% </span>
33+
<span class="strong">100% </span>
3434
<span class="quiet">Branches</span>
35-
<span class='fraction'>0/1</span>
35+
<span class='fraction'>0/0</span>
3636
</div>
3737

3838

3939
<div class='fl pad1y space-right2'>
40-
<span class="strong">0% </span>
40+
<span class="strong">100% </span>
4141
<span class="quiet">Functions</span>
42-
<span class='fraction'>0/1</span>
42+
<span class='fraction'>0/0</span>
4343
</div>
4444

4545

4646
<div class='fl pad1y space-right2'>
47-
<span class="strong">0% </span>
47+
<span class="strong">100% </span>
4848
<span class="quiet">Lines</span>
49-
<span class='fraction'>0/21</span>
49+
<span class='fraction'>21/21</span>
5050
</div>
5151

5252

@@ -61,7 +61,7 @@ <h1><a href="../index.html">All files</a> / <a href="index.html">src</a> App.vue
6161
</div>
6262
</template>
6363
</div>
64-
<div class='status-line low'></div>
64+
<div class='status-line high'></div>
6565
<pre><table class="coverage">
6666
<tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
6767
<a name='L2'></a><a href='#L2'>2</a>
@@ -84,56 +84,56 @@ <h1><a href="../index.html">All files</a> / <a href="index.html">src</a> App.vue
8484
<a name='L19'></a><a href='#L19'>19</a>
8585
<a name='L20'></a><a href='#L20'>20</a>
8686
<a name='L21'></a><a href='#L21'>21</a>
87-
<a name='L22'></a><a href='#L22'>22</a></td><td class="line-coverage quiet"><span class="cline-any cline-no">&nbsp;</span>
88-
<span class="cline-any cline-no">&nbsp;</span>
89-
<span class="cline-any cline-no">&nbsp;</span>
90-
<span class="cline-any cline-no">&nbsp;</span>
91-
<span class="cline-any cline-no">&nbsp;</span>
92-
<span class="cline-any cline-no">&nbsp;</span>
93-
<span class="cline-any cline-no">&nbsp;</span>
94-
<span class="cline-any cline-no">&nbsp;</span>
95-
<span class="cline-any cline-no">&nbsp;</span>
96-
<span class="cline-any cline-no">&nbsp;</span>
97-
<span class="cline-any cline-no">&nbsp;</span>
98-
<span class="cline-any cline-no">&nbsp;</span>
99-
<span class="cline-any cline-no">&nbsp;</span>
100-
<span class="cline-any cline-no">&nbsp;</span>
101-
<span class="cline-any cline-no">&nbsp;</span>
102-
<span class="cline-any cline-no">&nbsp;</span>
103-
<span class="cline-any cline-no">&nbsp;</span>
104-
<span class="cline-any cline-no">&nbsp;</span>
105-
<span class="cline-any cline-no">&nbsp;</span>
106-
<span class="cline-any cline-no">&nbsp;</span>
107-
<span class="cline-any cline-no">&nbsp;</span>
108-
<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js"><span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" ><span class="branch-0 cbranch-no" title="branch not covered" >&lt;template&gt;</span></span></span>
109-
<span class="cstat-no" title="statement not covered" > &lt;v-app&gt;</span>
110-
<span class="cstat-no" title="statement not covered" > &lt;div class="bg-dacxi-white h-full" data-testid="dacxi-app"&gt;</span>
111-
<span class="cstat-no" title="statement not covered" > &lt;Header /&gt;</span>
112-
<span class="cstat-no" title="statement not covered" > &lt;Content /&gt;</span>
113-
<span class="cstat-no" title="statement not covered" > &lt;/div&gt;</span>
114-
<span class="cstat-no" title="statement not covered" > &lt;/v-app&gt;</span>
115-
<span class="cstat-no" title="statement not covered" >&lt;/template&gt;</span>
116-
<span class="cstat-no" title="statement not covered" ></span>
117-
<span class="cstat-no" title="statement not covered" >&lt;script&gt;</span>
118-
<span class="cstat-no" title="statement not covered" >import Header from './components/Header.vue'</span>
119-
<span class="cstat-no" title="statement not covered" >import Content from './components/Content.vue'</span>
120-
<span class="cstat-no" title="statement not covered" ></span>
121-
<span class="cstat-no" title="statement not covered" >export default {</span>
122-
<span class="cstat-no" title="statement not covered" > name: 'App',</span>
123-
<span class="cstat-no" title="statement not covered" > components: {</span>
124-
<span class="cstat-no" title="statement not covered" > Header,</span>
125-
<span class="cstat-no" title="statement not covered" > Content,</span>
126-
<span class="cstat-no" title="statement not covered" > },</span>
127-
<span class="cstat-no" title="statement not covered" >}</span>
128-
<span class="cstat-no" title="statement not covered" >&lt;/script&gt;</span>
87+
<a name='L22'></a><a href='#L22'>22</a></td><td class="line-coverage quiet"><span class="cline-any cline-yes">1x</span>
88+
<span class="cline-any cline-yes">1x</span>
89+
<span class="cline-any cline-yes">1x</span>
90+
<span class="cline-any cline-yes">1x</span>
91+
<span class="cline-any cline-yes">1x</span>
92+
<span class="cline-any cline-yes">1x</span>
93+
<span class="cline-any cline-yes">1x</span>
94+
<span class="cline-any cline-yes">1x</span>
95+
<span class="cline-any cline-yes">1x</span>
96+
<span class="cline-any cline-yes">1x</span>
97+
<span class="cline-any cline-yes">1x</span>
98+
<span class="cline-any cline-yes">1x</span>
99+
<span class="cline-any cline-yes">1x</span>
100+
<span class="cline-any cline-yes">1x</span>
101+
<span class="cline-any cline-yes">1x</span>
102+
<span class="cline-any cline-yes">1x</span>
103+
<span class="cline-any cline-yes">1x</span>
104+
<span class="cline-any cline-yes">1x</span>
105+
<span class="cline-any cline-yes">1x</span>
106+
<span class="cline-any cline-yes">1x</span>
107+
<span class="cline-any cline-yes">1x</span>
108+
<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">&lt;template&gt;
109+
&lt;v-app&gt;
110+
&lt;div class="bg-dacxi-white h-full" data-testid="dacxi-app"&gt;
111+
&lt;Header /&gt;
112+
&lt;Content /&gt;
113+
&lt;/div&gt;
114+
&lt;/v-app&gt;
115+
&lt;/template&gt;
116+
&nbsp;
117+
&lt;script&gt;
118+
import Header from './components/Header.vue'
119+
import Content from './components/Content.vue'
120+
&nbsp;
121+
export default {
122+
name: 'App',
123+
components: {
124+
Header,
125+
Content,
126+
},
127+
}
128+
&lt;/script&gt;
129129
&nbsp;</pre></td></tr></table></pre>
130130

131131
<div class='push'></div><!-- for sticky footer -->
132132
</div><!-- /wrapper -->
133133
<div class='footer quiet pad2 space-top1 center small'>
134134
Code coverage generated by
135135
<a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
136-
at 2022-11-04T23:28:26.684Z
136+
at 2022-11-05T21:04:09.215Z
137137
</div>
138138
<script src="../prettify.js"></script>
139139
<script>

0 commit comments

Comments
 (0)