Project Related

84 阅读3分钟

Introduction

  • Hello, my name is Arlene Tang. I graduated from HDU and worked as a front-end engineer for four years. Mainly involved in page rendering on the B and web ends. I have used Vue and React, among which React is more proficient. My latest project is to display the company's internal web page for data governance. According to the security rules, Data cleansing is performed by deleting or encrypting data.

  • I basically completed everything from framework building to deployment and launch alone.

    • This is a tool project used internally by the company. The personnel composition includes one product manager, one backend, and one front-end.

    • I didn't remember the specific mention of an EU data requirement agreement.

    • The front-end is more about data display and data operation buttons, and the specific encryption process is actually transmitted to the back-end for encryption.

    • I have a JSON file with a list of personnel from all levels of departments. It is roughly divided into three levels and displayed on the page through a tree menu. In the main table page, I control that only first and second level personnel will display operation buttons, which can perform operations and transmit data to the backend, while third level personnel will not directly display operation buttons.

Most difficult

  • The biggest problem I encountered was unit testing. At the beginning, I felt very different from the previous code thinking. There needs to be a change in mindset. Transform the rendered page into simulated data and verify the output results to determine component logic. By constantly browsing official documents and excellent code from others , I complete the task ultimately.

How to deploy your project?

  • Our project is deployed by using the company's internal website. As long as we submit to the corresponding git branch, we can obtain the latest git branch on the website and deploy the corresponding functionality. I have also had experience deploying to a server through xshell or FileZilla after packaging locally.

Good habit - workflow

  • I have a good habit in my work, which is to periodically summarize some problems or precautions I encounter during work. For example, I summarized a workflow before. Firstly, clarify the requirements and review the prototype diagram, including whether the interaction logic is smooth and whether the style is consistent. Afterwards, there will be an evaluation of the working hours in terms of technology and whether it is necessary to use new plugins in order to implement new functions. In the end, the page is drawn. When drawing a page, it is further divided into several steps.

    • Firstly, I will break down the common components for easy reuse. Then there is functional writing and style drawing. Finally, there is interface debugging. If the backend has not yet completed the interface part, I can mock data. The closing section mainly aims to reconfirm whether all requirements have been implemented. Perform self testing of the functions on the page. After all are completed, indicate the function upload code.

Briefly introduce the new technology you have recently learned

  • I recently saw an interesting drawboard project on Github that allows for drawing and includes AI graphics generation functionality. It is a project that does not separate the front and back ends. The front-end uses React and Typescript, while the back-end uses Python. I have separated the front and back ends of this project. I found it to use canvas for drawing functions, websocket for communication, chakra for component libraries which I haven't heard of, and many hooks for custom functions, all of which I found very interesting.

To be honest

Although I often watch English related technical documents and movies, I am not very confident in my oral English. I prepared many questions and answers in advance, which indirectly proves that I am a person who likes to plan ahead.

I have read the official website in advance and only gained a general understanding.

How do you deal with a tricky problem?

  • Firstly, I will clarify the source of the problem. Is the proposal of this requirement necessary, logical, and prioritized. Secondly, I will break down this issue into smaller specific tasks and execute them accordingly. Finally, review and submit the task.

How do you encrypt it

  • We will encrypt the password by ASE algorithm during login. Make sure the password is not directly exposed.

Error message processing

  • The most important thing is to prevent the occurrence of bugs. Carefully write notes for each function and clarify the parameters of the component. Secondly, locate the error by watching the error notification on the browser's console. Also, it involves writing unit tests and verifying logic.