votUCAweb

Description

This repository is for a project of the subject Informatic Projects, that is about a digitatilzation of elections and votes.

In the University of Cadiz, we have differents kind of votes, and we will provide a web app that allow us to vote online.

Prerequisites

Node

If you don't have node yet, install using

• nvm on linux

  • nvm install --lts

• choco on windows

  • choco install nodejs-lts

Yarn

$ npm -g install yarn

Installation

$ yarn install

Running the app

Before star run the backend following their readme

yarn start

Codegen

If you add a query on src/graphql/documents run the following command to generate the hooks.

yarn codegen

Code style

This project use airbnd code style

Formatting

This project has configured eslint + prettier to follow the standardjs code style

If you use VSCode add the following to your settings to autoformat on save

  "eslint.autoFixOnSave": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "typescript",
      "autoFix": true
    },
    {
      "language": "typescriptreact",
      "autoFix": true
    }
  ]

How to commit

This project is going to use conventionalcommits as commit format to help us create changelogs

Example

git commit -m "chore: update dependencies"

If you don't know the coventionalcommits syntax:

Install commitizen as global utility

yarn global add commitizen cz-conventional-changelog

Create a .czrc file in your home directory, with path referring to cz-conventional-changelog

echo '{ "path": "cz-conventional-changelog" }' > ~/.czrc

On windows copy the following line to the PowerShell:

write-output '{ "path": "cz-conventional-changelog" }'  | out-file $env:HOME/.czrc

Commiting with commitizen prompt

with this approach use always the terminal

If the commands doesn't work add the following line export PATH="$PATH:$(yarn global bin)" to your .bashrc or .zshrc

Built With

TypeScript

TypeScript is a superset of JavaScript which primarily provides optional static typing, classes and interfaces

GraphQL

GraphQL is a syntax that describes how to ask for data, and is generally used to load data from a server to a client

Apollo Client

Apollo Client is a complete state management library for JavaScript apps. Simply write a GraphQL query, and Apollo Client will take care of requesting and caching your data, as well as updating your UI.

React Router

React Router is a collection of navigational components that compose declaratively with your application.

React

A JavaScript library for building user interfaces

Ant Design

A design system with values of Nature and Determinacy for better user experience of enterprise applications

Formik

Build forms in React, without the tears 😭

Formik Ant

Simple declarative bindings for Ant Design and Formik.