Web Tool

1 - In the very Beginning:

The web tool is developed during my internship In Apple hardware test team. The intellectual property belongs to Apple Inc. Therefore, I won't post anything revealing the detail contents of original project or leak the original code and pictures. Everything mentioned here is just technical oriented!

Fig 1. Apple Inc. Logo

2 - Introduction:

The main function of the web tool is to locate content in log files that has the nearest timestamp to a selected timestamp in a CSV file. Simply speaking, it's an online web tool for data processing, presenting, sorting and locating.

I developed both frontend and backend by myself. Frontend is coded mostly by HTML and JavaScript plus a little bit CSS. Backend is programmed using python. I use Flask as my web framework, which enables the communication between frontend and backend.

3 - Fronend:

Frontend features a user friendly outlook. Everything here is to be as simple as a few clicks. But it still capable of doing many things. The first one is to rearrange data and present CSV or Log data in an easy-reading way. We also have plenty functions for you to use which is much easier than using an excel form. For example, sorting data with any key elements you like, filtering key information and locating corresponding log files etc. It supports multiple-file uploading and can present both CSV file and Log file side by side for better viewing.

Fig 2. HTML Icon

Fig 3. JavaScript Icon

4 - Backend:

The backend is used for data processing. When users upload CSV and Log files through the frontend, all files will be sent back to a Python script. The Python script will handle CSV and Log files differently. For CSV file, it mainly extract useful information and reformatted the data. For Log files, it will divide the whole content into different chunks based on the timestamp. The processed data group will be sent back to the frontend and put into right locations. The communication between the frontend and backend is done trough Flask, a micro web framework that is easy to implement.

Fig 4. Python Icon

Fig 5. Flask Icon

5 - More to say:

The web tool is designed for specific use for Apple Inc. Thus, it can't meet all the demands for other use. However, the key idea for develop a web tool is making a specific task easier. If a web tool can solve most problems, it is no different to Excel.

The basic framework of making a web tool is pretty clear to me, I can easily implement my method to deal with all other kind of problems and make different web tools for different purposes.

Home Page

Page updated

Report abuse