Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 0 additions & 7 deletions .babelrc

This file was deleted.

1 change: 1 addition & 0 deletions .dockerignore
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
node_modules/
22 changes: 22 additions & 0 deletions .eslintrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
{
"parser": "babel-eslint",
"env": {
"browser": true,
"es6": true,
"jest": true,
"node": true
},
"settings": {
"react": {
"version": "16.13.1"
}
},
"extends": [
"eslint:recommended",
"react",
"plugin:react/recommended"
],
"plugins": [
"react"
]
}
39 changes: 39 additions & 0 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
name: Release

on: release

jobs:
unit-testing:
name: Unit Tests
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: 13
- name: install dependencies
run: npm install
- name: run tests
run: npm test

deploy:
name: Deploy to GitHub Pages
runs-on: ubuntu-latest
needs:
- unit-testing
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: 12.x
- name: Install Packages
run: npm install
- name: Build page
run: npm run build --verbose
env:
CI: false
- name: Deploy to gh-pages
uses: peaceiris/actions-gh-pages@v3
with:
deploy_key: ${{ secrets.ACTIONS_DEPLOY_KEY }}
publish_dir: ./build
22 changes: 22 additions & 0 deletions .github/workflows/testing.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
name: Testing

on: push

jobs:
unit-testing:
name: Unit Tests
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- uses: actions/setup-node@v1
with:
node-version: 13
- name: install dependencies
run: npm install
- name: run tests
run: npm run test:ci
- name: Codecov
uses: codecov/codecov-action@v2
with:
token: ${{ secrets.CODECOV_TOKEN }}
flags: unittests
6 changes: 3 additions & 3 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -59,6 +59,6 @@ typings/

# next.js build output
.next

public/css/*
public/js/*
.history/
.vscode/
build/
28 changes: 9 additions & 19 deletions Dockerfile
Original file line number Diff line number Diff line change
@@ -1,31 +1,21 @@
# -- Dockerfile -- #
#
# docker build -t react-exercise .
# docker run -dit --name react-instance -v `pwd`:/storage/app -p 80:8080 react-exercise
# docker run -dit --name react-instance -p 80:3000 react-exercise
# docker exec -it react-instance /bin/bash

FROM ubuntu:16.04
FROM node:12-buster

LABEL Description="React Sudoku" Version="1.0"

# Install generic tools
RUN apt-get update && apt-get install -y \
sudo \
vim \
net-tools \
curl
EXPOSE 3000

# Add node source repository to install the latest version
RUN curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
ARG APP_DIR="/opt/exercise-react"

# Install basic tools
RUN apt-get update && apt-get install -y \
nodejs
RUN mkdir -p ${APP_DIR}
WORKDIR ${APP_DIR}

# Bring the process starter
COPY startup.sh /root/
RUN chmod +x /root/startup.sh
COPY . ${APP_DIR}
RUN npm install

EXPOSE 8080

ENTRYPOINT [ "/root/startup.sh" ]
ENTRYPOINT [ "npm", "run", "start" ]
12 changes: 3 additions & 9 deletions EXERCISES.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,20 +7,14 @@ All the exercises are possible and have been tested.

## Basic exercises

1. Change color of the tiles the user has inserted a value.
1. Change color of the tiles the user is editing at the moment.

This exercise involve only sass updates. [SASS](https://sass-lang.com/) and
[CSS pseudo-classes](https://www.w3schools.com/css/css_pseudo_classes.asp)

2. Move navigation menu at the bottom of the Sudoku.
2. When the sudoku is solved, show a message congratulating the user.

For this we don't need react, as we can't access the SudokuGame component thus it's
not possible to move it freely as we would like.

As workaround, it's possible to use [jQuery](http://api.jquery.com/) directly to
modify DOM elements however we want. Once the DOM is [ready](http://api.jquery.com/ready/),
we should [manipulate](http://api.jquery.com/category/manipulation/) the element
to move it wherever we want.
For this we will need to understand the SudokuGame component and how to pass it callbacks.

## Medium exercises

Expand Down
26 changes: 15 additions & 11 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,4 +1,8 @@
## Synopsis
# Synopsis

[![Benchmark](https://github.com/gguridi/exercise-react/actions/workflows/release.yml/badge.svg?branch=master)](https://github.com/gguridi/exercise-react/actions/workflows/release.yml)
[![Codacy Badge](https://app.codacy.com/project/badge/Grade/d1cd1dc3fafb4086802a9a4a79b39189)](https://www.codacy.com/gh/gguridi/exercise-react/dashboard?utm_source=github.com&utm_medium=referral&utm_content=gguridi/exercise-react&utm_campaign=Badge_Grade)
[![codecov](https://codecov.io/gh/gguridi/exercise-react/branch/master/graph/badge.svg?token=IUDIfrcUOY)](https://codecov.io/gh/gguridi/exercise-react)

This is a basic website intended to work with React and Bootstrap. This website gives a basic
functionality to show information in a responsive way.
Expand All @@ -13,7 +17,7 @@ The first thing to do is to [fork this repository](https://help.github.com/artic
in your account. Once you have it forked you can clone it in your local environment
with the command:

```
```bash
git clone {repo-url} ./local-folder
```

Expand All @@ -28,16 +32,16 @@ operating system you are running.

Once docker is installed, go to this folder and build the virtual machine with:

```
```bash
cd <path-to-this-code>
docker build -t react-exercise .
```

Then execute the following code to run the virtual machine. The webservice will be mapped automatically to the port 80
of our local machine. (ensure no other process is running in the port 80 or it might conflict):

```
docker run -dit --name react-instance -v `pwd`:/storage/app -p 80:8080 react-exercise
```bash
docker run -it --name react-instance -p 80:3000 react-exercise
```

Note that the container has been created to run as an application. Once running it will
Expand All @@ -46,14 +50,14 @@ show the standard output and terminating the process will terminate also the con
To connect to the container we can use (this will allow us to execute commands from
inside the container using the bash shell):

```
```bash
docker exec -it react-instance /bin/bash
```

If you need to rerun the virtual machine then we need to remove it first. Maybe the
following commands will help you executing _docker run_ again.

```
```bash
docker stop react-instance
docker rm react-instance
```
Expand All @@ -72,15 +76,15 @@ operating system you are running.
Then, from the folder we have cloned the code, we can see a `package.json` file.
This file contains the dependencies of our project. To install them type:

```
```bash
npm install
```

This will create a folder called `.node_modules` that will contain the dependencies.

Once the dependencies are there, we can start the development server with:

```
```bash
npm run start
```

Expand Down Expand Up @@ -113,7 +117,7 @@ The second one is installing them through npm. Then we include them as part of o
React project and we let webpack, when builds the application, to manage the
integration.

```
```bash
import 'jquery';
import 'bootstrap/dist/js/bootstrap';
```
Expand All @@ -134,7 +138,7 @@ The tests are located altogether with the code, under the .test.js extension.

We can run the tests from inside the container or from outside, with:

```
```bash
npm run test
```

Expand Down
Loading