Skip to content

A Kanban board web app, implemented as a state-centric React-Redux application.

License

Notifications You must be signed in to change notification settings

charliegdev/waffle

Repository files navigation

Waffle

Waffle is a Kanban board web app, implemented as a client-side React-Redux application.

The application is still under active development; new functions are continually being built.

Features

Below is a list of major features.

Add

new-task

Delete

delete-task

Move Task to Another Column

move-task

Data Preservation

Data is saved, so nothing is lost after refresh or server restart:

save-tasks

Styling and Design

As an early prototype, I took MeisterTask as my inspiration for my styles. In the future, when the product is more mature, there will likely be some changes in the art style.

Additional Details on GitHub

Besides the list above, the GitHub repo also contains lots of detailed information:

  • You can look at the closed pull requests on details about how these functionalities are implemented, such as the PR for SCSS import and its closed issue.
  • Similarly, the GitHub open issues contains the most up-to-date list of planned features and bug fixes.
  • From a project management point of view, you can see how the pull requests and issues were managed inside the GitHub Projects section; for example, the Sprint 1 board.
  • Optionally, the commits might tell some detailed information as well.
  • Finally, you can visit the Insight page on the velocity of the development.

Upcoming Functionalities

Since the project is still at a very early stage, lots of functionalities are awaiting design and implementation. They are listed down below, with the highest priority item on the top:

  1. Reordering tasks
  2. Clicking on the task to open a modal dialog
  3. User login/logout
  4. Guest mode
  5. Support for multiple projects
  6. Email notification
  7. A decoupling between projects and users, so:
    • A project can have multiple users
    • A user can own, view and subscribe to multiple projects

Besides new features, new tests should be written as well:

  1. Redux unit tests
  2. Cypress integration tests

Tech

This section is about the technology used to develop the application.

I plan to use these technologies in future developments:

  1. Cypress in integration testing. At this point, the application is big enough to have meaningful automated integration test, so I think it's a great idea to start writing tests alongside development, instead of waiting for the application to get much larger and introduce regression bugs without knowing.
  2. One of Python Flask or PHP Laravel as the server technology. Right now I'm using JSON Server which is fine for storing, modifying and retrieving tasks; however, to do anything substantial on the server side, I'll need a real server technology, and both Flask and Laravel are something I would like to try.

Build & Test

If you would like to run this on your machine, follow these steps.

Prerequisite

Make sure you already have those installed:

  • Node.js. npm comes automatically as part of Node.js; optionally, you can also install Yarn from Facebook.
  • Git

Build & Run

  1. Clone the repo: git clone [email protected]:charliegdev/waffle.git
  2. On the command line, navigate to the repo directory.
  3. In the directory, run yarn or npm i to install all local dependencies.
  4. Once all the dependencies are installed, run yarn start or npm start to start the Webpack server for the client.
  5. In another terminal tab, navigate to the project root and run yarn run server or npm run server to start the JSON server.

Test

To start the test, navigate to the project root and run

yarn test

or

npm test

We haven't setup Cypress tests yet, so the unit tests in Jest is all we have.

Here is a sample terminal output in Hyper:

terminal-output

Naming

Its name happens to clash with another now-closed Kanban board app with the same name. When I thought of the name Waffle, the application mentioned above was already closed, and I wasn't aware of its existence. I don't have a plan to monetize from this product; but if I do one day, I will probably give the application an external product name to avoid potential legal hassle.

License

MIT license. Use it in whatever way you want; credit is appreciated.

View the MIT license here.

Contribution & Code of Conduct

If you see something worth improving or not working, it'll be awesome if you can leave an issue, or even open a pull request yourself. Constructive criticism is always appreciated. Please follow the Code of Conduct.

About

A Kanban board web app, implemented as a state-centric React-Redux application.

Topics

Resources

License

Code of conduct

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published