404kacper / ran-logger

RAN-logger

Project aim:

Processing and display of RAN logfiles in standalone html file.

Project Status

In development.

Example:

This project is currently in development. Users can filter tweets by username and keyword and see visual data representation. Functionality to sort by additional parameters is in progress.

Project Screen Shot(s)

Example:

[ PLACE FOR SCREENSHOT ] [ PLACE FOR SCREENSHOT ]

Installation and Setup Instructions

Example:

Clone this repository in directory of your choice. You will need node and npm installed globally on your machine.
Installation (must be done every time repository is cloned): npm install

To Start App: npm start

To Run Test Suite:
npm test
To Visit App:
localhost:3000

Reflection

• What was the context for this project? (ie: was this a side project? was this for Turing? was this for an experiment?)

• What did you set out to build?

• Why was this project challenging and therefore a really good learning experience?

• What were some unexpected obstacles?

• What tools did you use to implement this project?

  • This might seem obvious because you are IN this codebase, but to all other humans now is the time to talk about why you chose webpack instead of create react app, or D3, or vanilla JS instead of a framework etc. Brag about your choices and justify them here.

    Example:

    This was a 3 week long project built during my third module at Turing School of Software and Design. Project goals included using technologies learned up until this point and familiarizing myself with documentation for new features.
    Originally I wanted to build an application that allowed users to pull data from the Twitter API based on what they were interested in, such as 'most tagged users'. I started this process by using the create-react-app boilerplate, then adding react-router-4.0 and redux.
    One of the main challenges I ran into was Authentication. This lead me to spend a few days on a research spike into OAuth, Auth0, and two-factor authentication using Firebase or other third parties. Due to project time constraints, I had to table authentication and focus more on data visualization from parts of the API that weren't restricted to authenticated users. At the end of the day, the technologies implemented in this project are React, React-Router 4.0, Redux, LoDash, D3, and a significant amount of VanillaJS, JSX, and CSS. I chose to use the create-react-app boilerplate to minimize initial setup and invest more time in diving into weird technological rabbit holes. In the next iteration I plan on handrolling a webpack.config.js file to more fully understand the build process.

ran-logger's Issues

Pagination

If a file is loaded and selected, and that file takes up more than 1 list page - then say second page of the list is selected and then new file is selected that only fills 1 page then the pagination will stay on second page of the 1st file and will never display any contents of the first file --- easy fix is to alway set pagination page to 1 whenever new activeFile is selected in global state.

LogsState - context api - preferences

With current implementation, whenever preferences are checked true to false they will remove all of logs data from storage (caused by re-render of LogsState due to preferences state dispatch/update) - to solve that different Context provider say PreferencesState is needed that will be wrapped by LogsState so that it's updates aren't impacting renders of LogsState that is an expensive operation when files will reach sizes of +20MB.

Way in which logs are added to local storage is as follows:
file dropped --> promises resolve causing state to update -> each update to logs causes useEffect in files to overwrite values in local storage with current state.logs (except for initial render since it's only fetching)

Dropzone security

Whenever file format different than .txt is dropped and remember box is checked out - the app will continiously crash.
LocalStorage of the browser is filled with junk - app is unable to interpret any other format than .txt so unless local storage is cleared it won't stop crashing - even after reastarting the pc !!! Only fix is to clear cache of the browser itself - very dangerous issue that needs to be avoided in component - accept only .txt and store it after format checking is done.