BeranaViz

A data structures and algorithms visualizer


View Demo · Report Bug · Request Feature

About The Project

BeranaViz is a data structures and algorithms visualization that can help you quickly learn data structures and algorithms concepts through animation that you can control. This app allows you to see every step made by a search or sorting algorithm.

In addition, you can also save your documents by creating an account so that you wont lose your data.

Built With

This project is the front end part of BeranaViz web app and is built with ReactJs. For state management, Redux is used. Furthermore, to authenticate with the backend api, it uses Firebase.

Getting Started

You can directly start using the app by heading over to beranaviz. However, if you want to run the app locally you can follow the instructions below.

Installation

1. Clone the repo

   git clone https://github.com/kalibetre/berana-viz.git

2. Install NPM packages

   npm install

3. Head over to Firebase, create a project and obtain a service account key
4. Setup Environment variables

   REACT_APP_API_KEY=
   REACT_APP_AUTH_DOMAIN=
   REACT_APP_PROJECT_ID=
   REACT_APP_STORAGE_BUCKET=
   REACT_APP_MESSAGING_SENDER_ID=
   REACT_APP_APP_ID=
   REACT_APP_MEASUREMENT_ID=

5. Setup and run the backend api (berana-viz-api) and set the API_URL env variable (see below example)

   REACT_APP_API_URL=http://127.0.0.1:8000/api/v1/

6. Start the project

   npm start

Roadmap

• Add more data structure visualizations
• Add more sorting and searching algorithms
• Prepare a full app documentation for contributors
• Multi-language Support
  • Amharic

See the open issues for a full list of proposed features (and known issues).

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

License

Distributed under the MIT License. See LICENSE.txt for more information.

Contact

Kalkidan Betre - @kalibetre - kalbetre@icloud.com

Project Link: https://github.com/kalibetre/berana-viz