search

vadim9999 / js

2 stars 0 forks source link

What I have done in startup #7

Open vadim9999 opened 5 years ago

vadim9999 commented 5 years ago

Working on projects: showcase sub-project: frontend, adding some new features. Code testing and bug fixing. used technologies: 'react-router-dom', grocery-fetch plugin: static data, I'm reviewing changes of other interns work, and publish new versions at npm. sd: module that contains static files. I have curated some interns. food-static-files-generator: module is written on ES5. This module generates jsons files from functions logics. Setting up roollup and babel.

food-datasets-csv-parser: converts from csv to jsons data. fake-api: fixed bug of deploying into heroku. Created routes recipe-antd: calendar: used technologies: 'react-router-dom', react-print-pdf: develop button that will generate pdf. Used @react-pdf/renderer Splitted in one header from projects showcase, recipe-antd, calendar
Published 5 documentation sites using Docusaurus(ReactJS). Working as part of remote team members, located around the globe. Helping new members to understand our workflow. Reviewing their progress and help with questions. Handle all communication at Slack. Using GitHub as the main place for share code with other team members. All team members communicating in English.

vadim9999 commented 5 years ago

@atherdon Can you help to complete block of my expirience in startup for resume?

atherdon commented 5 years ago

Sure, let's explore it together, i mean we both need to discuss it.

let's start from the beginning. 1) Are you remember what we did before working on a fetch plugin? 2) What exactly you did at fetch plugin. Explain in 10 sentences

vadim9999 commented 5 years ago

I have moved data from the variable into json file. Created functions that parse from json, add id in each item of array. With help of lodash used this functions: find, map, reduce, slice, remove. Add tests and documentation on writed functions. I have Added functions to GroceriStar, Showcase, GraphQL, GS-Loopback.

Thats all @atherdon

atherdon commented 5 years ago

hmm, but you know that other people don't know what GroceriStar, Showcase, GraphQL, GS-loopback stands for, right?

Can you explain each of repository that you was working on in 5 sentences and what you actually did there

atherdon commented 5 years ago

plus spend time and explain in details, especially tech side of ant-farm as it's your side-project that you can talk about

vadim9999 commented 5 years ago

groceristar-fetch

// @TODO short sentence of what this module doing This module contains functions that return data for a specific project. It's like a database working every time using JSON files for store data. Goal: main module of projects:

Frontend(React): // @TODO it better to replace each name to explanation of what that project doing

Backend: // @TODO it better to replace each name to explanation of what that project doing

submodules:

Work I have added tests that check data are not empty, compare it with data that stored in json's files. Testing: toEqual, arrayContaining, not.toBe(' '), toHaveProperty, toMatchObject, arrayContaining, objectContaining Lodash:: _.filter Functions that returns:

Added static data nutritions and weekly menu

sd Goal: store static jsons files. Using modules: food-static-files-generator and food-datasets-csv-parser. This module using two modules for generating static jsons files.

Work A lot of functionality was moved from fetch into generator. Connected food-static-files-generator that generation static files was in this module.

food-static-files-generator Goal: generate additional json static files for projects.

What I have done Using module 'fs' created code that writes files into a selected folder in the same module. Review and merged pull requests from other interns. Curated of process converting from ES5 to ES6. Fixed bug of running tests written in ES6.

showcase Goal: display grocery like a tile. Each tile contains departments and their ingredients. And download pdf. Used modules: groceristar-fetch, pdf-export

Work

Added shortid adding generated key to each element. Added components that displaying ingredients with their description. Added download button that generate pdf. PDF contains grocery with departments and ingredients. Added styles for pdf. Added button grocery name second button that generate pdf with using flexbox Made optimization on rendering using additional tool 'why-did-you-update'. Find out which components rerendering and slow down the working site. After finding problematic components fix it changing extends from 'Component' to 'Pure Component'. In a more complex situation used method shouldComponentUpdate. After this working of the site was faster than before. Also with more effect components was refactored(or separated). Optimized was this components:

Used PDF Wiever for debuuging PDF Elements

With help of 'axios' made request to server fake-api that is deployed in heroku. Function that returns griceries with key Added spin from 'antd'

calendar Goal of creation Function that returns five random recipes. Improved code of rendering clocks (timeline). Made improvement of code. Clean code. add recipesChickenKyivById

react-shopping-list-template Goal of creation: Custom components. Work: Created custom components: EditLink, Label, SimpleText, TextId, ListItem, SelectBox, ListItemLink, SortableList. ListCheckbosDeleteLink, ListCheckboxDeleteIcon, ListLayouts. Added routes An added form that has Label and input, SelectBox, and SubmitButton.Tired with event handlers. Added into form AutoComplete input. Used Ant design in AutoComplete. Added List of ingredients. List with checkbox

pdf-export-component Work: fix bugs and refactor code and some improvement of the code.

react-print-pdf Work: Added layout of generating pdf

fake-api Work Added routes functions that:

GraphQL Work Added some resolvers for get favorites. Added generating key for each object.

reactjs-clients

Created onepage application with list of clients ant their details using React and Semantic-UI framework. Clients data are stored in 'clients.json'.

Clients list consists

Every item that display smaller avatar. Next to the avatar there are clients name and job title. When user clicks on an item, it Will display client's details on the right.

Search

Above this list there are search bar. It search all information, not only those showed in the clients list. Results will be displayed instead of list of clients and they will show instantly as user starts to type.

Clients details

Prettty self-explanatory, on the left there are fill size avatar (128x128px), next to it big clients name, smaller job title and company name ('job.title - (job.company)') below this name. Next there are all other clients informations like address, and contact informations.

Used this technology:

Ant farm

Ant Farm contains web-server and application on OS Android.

Goal: Develop and program the Python Web server and an Android application using the Raspberry to support the activity of an Ant Farm.

Automated control system allow:

  1. Video streaming in YouTube.
  2. Feed ants after a certain time.
  3. Informing about the water level in the tank.
  4. Provision of information on temperature and humidity in the form of cats.

Writing web server on Python3.7 used this libraries:

Frontend:

Ant Farm App: Technologies that was used to create app:

Easy Bluethooth Classic used to Search for Bluetooth devices, connect to them, receive and transfer data via client and Python server. Native Base framework to make the App AntFarm more beautiful. React Navigation allow add drawer navigation and tire screens. This application was created to connect (or change) RPi to the WIFI network via Bluetooth. The app allows search for all devices located around you. After picking up AntFarm and connected to it will be accessing these features: setting up wifi network that was found RPi, and get information about what IP is listening to web server in AntFarm. After this user should be in the same network with AntFarm then open the browser and write IP that was displayed App. App has two screens: Main and About the app.

atherdon commented 5 years ago

updated a bit - apply my comments and buzz me

atherdon commented 5 years ago

imagine that you will show this to your family(rus version) - will they understand what you've done?

and same long explanation for ant-farm prepare as well

atherdon commented 5 years ago

task title starting this track: https://www.youtube.com/watch?v=8sgycukafqQ

vadim9999 commented 5 years ago

imagine that you will show this to your family(rus version) - will they understand what you've done?

and same long explanation for ant-farm prepare as well

No, because they don't know English

vadim9999 commented 5 years ago

task title starting this track: https://www.youtube.com/watch?v=8sgycukafqQ

changed :+1:

vadim9999 commented 5 years ago

Prepare explanation of ant-farm and reactjs-clients(tested task from incode group that I have added before when I was searching for a job as Intern)

atherdon commented 5 years ago

yes - i forget about that test assesment that you have with forms and redux

vadim9999 commented 5 years ago

@atherdon How much information should I add?

atherdon commented 5 years ago

as much as possible

vadim9999 commented 5 years ago

@atherdon Is it normal that my resume will be containing 3 maybe 4 pages?

atherdon commented 5 years ago

yep. this what we trying to do. to have 1-pager - with short details. and pages after that give more information about your skills

vadim9999 commented 5 years ago

Worked on projects:

groceristar-fetch: JS module that contains functions that return data for a specific project. It's like a database that working every time using JSON files for store data. This module is used by such projects:

Frontend(React): Showcase: display grocery like a tile. Each tile contains departments and their ingredients and a button to download pdf; Calendar: display meal calendar for health food; Recipe Antd: allow add cards with recipes, change ingredients and cooking recipes. Backend: Fake-API - expressjs server that deployed on Heroku. Allow getting data other subprojects; GraphQL - returns data for import into graphQL server; Loopback - returns data that ready to be imported into the loopback server. Submodules: MealConversion; Search.

   I'm reviewing changes of other intern's work, and publish **new versions** at npm. I have added tests that check data they are not empty stored in JSON files. While writing tests used this functions: toEqual, arrayContaining, not.toBe(' '), toHaveProperty, toMatchObject, arrayContaining, objectContaining.

Added static data related with nutritions and the weekly menu also updated it into JSON format. Added menu and getter, a stack of ingredients.

The logic of written functions that returns:

ingredients by one department with using method .filter from Lodash; all departments using .map; grocery by name with using _.filter; grocery by name that contains departments and ingredients; five random ingredients ; data for GraphQL; sd: JS module of storing static JSON files. Using two modules for generating static JSON files. A lot of functionality was moved from fetch into the generator. Connected food-static-files-generator that generation static files were in this module.

food-static-files-generator: JS module that generates additional JSON static files for projects.

Using module 'fs' created code that writes files into a selected folder in the same module. Review and merged pull requests from other interns. Curated of team workers converting from ES5 to ES6. Fixed bug of running tests written in ES6. Configured rollup and babel.

showcase: ReactJS module that displays groceries like a tile. Each tile contains departments and their ingredients. Used modules: groceristar-fetch, pdf-export. I have added:

package shortid for adding a key to each element in the object; components that displaying ingredients with their description; download button that generates PDF. PDF contains grocery with departments and ingredients and styles for pdf; a button that generates PDF using flexbox; routes using module 'react-router-dom'. Made optimization on rendering using additional tool 'why-did-you-update'. Find out which components rerendering and slow down the working site. Fixed founded problematic components replacing extends on 'Pure Component'. In a more complex situation, the used method shouldComponentUpdate. After this working of the site was faster than before. Also with more effective components were refactored.

Used PDF Viever for debugging PDF Elements.

With the help of 'axios' requested server fake-API that is deployed in Heroku.

calendar: The ReactJS project in which food is written by the hour.

I have created a function that returns five random recipes. Improved code of rendering clocks (timeline) and cleaned code.

react-shopping-list-template: ReactJS module that contains custom components. Created custom components:

EditLink, Label, SimpleText, TextId, ListItem, SelectBox, ListItemLink, SortableList. ListCheckbosDeleteLink, ListCheckboxDeleteIcon, ListLayouts.

Added routes for rendering it.

I have made a form that has Label and Input, SelectBox, and SubmitButton. Tired with event handlers. Added into form AutoComplete(Ant design) input.

I added a list of ingredients and list with checkbox

pdf-export-component: ReactJS module that contains a button for generating PDF and layouts for it. I have fixed bugs, refactor code and made some improvement of the code.

react-print-pdf: ReactJS module of debbuging PDF generator. I have created an additional layout for generating PDF.

fake-API: NodeJS module that using expressjs for returning data for projects. I have developed routes that return:

grocery by id; grocery collection ; all groceries which consists of the only grocery that has departments and ingredients with keys. I developed tests for checking response access from routes and gets HTTP status 200. Fixed bug of executing tests on Travis CI and fixed error of CORS

graphql-server: NodeJS server using the GraphQL framework. The server that stores data from groceristar-fetch. Created some resolvers and updated functions for DB style.

Published 5 documentation sites using Docusaurus(ReactJS). Working as part of remote team members, located around the globe. Helping new members to understand our workflow. Reviewing their progress and help with questions. Handle all communication at Slack. Using GitHub as the main place for share code with other team members. All team members communicating in English. Additional works

ReactJS Clients

I have created a one-page application with a list of clients and their details using the React and Semantic-UI framework. Client data are stored in a JSON file.

Clients list consists: Every item that displays a smaller avatar. Next, to the avatar, there are the client's name and job title. When a user clicks on an item, it will display the client's details on the right.

Search: Above this list, there is a search bar. It searches for all information, not only those showed in the client's list. Results will be displayed instead of a list of clients and they will show instantly as the user starts to type.

Clients details: Pretty self-explanatory, on the left, there are fill size avatar, next to its big client's name, smaller job title, and company name, below this name. Next, there is all other client's information like address and contact information.

Used this technology:

ReactJS Semantic-UI framework Redux Ant Farm

Ant Farm is a diploma project that I have made 6 months. Project contains web-server(ant-farm) and application on OS Android(AntFarmReactNative).

The goal of creation: Develop and program the Python Web server and an Android application using the Raspberry to support the activity of an Ant Farm.

ant-farm: web-server written in Python 3.7 Ant-farm allow:

Create a video stream on YouTube. Feed ants after a certain time. Informing about the water level in the tank.

Writing web server on Python3.7 used these libraries:

Backend: picamera http.server socketserver subprocess os Frontend: HTML, CSS, JS AJAX, Bootstrap, Font Awesome AntFarmReactNative: React Native project for Ant Farm. Technologies that were used to create app:

React Native; Easy Bluetooth Classic- used to Search for Bluetooth devices, connect to them, receive and transfer data via client and Python server; NativeBase - a framework to make the App AntFarm more beautiful; React Navigation allows add drawer navigation and tire screens to Ant Farm App. This application was created to connect (or change) RPi to the WIFI network via Bluetooth. The app allows search for all devices located around you. After picking up AntFarm and connected to it will be accessing these features: setting up wifi network that was found RPi, and get information about what IP is listening to web server in AntFarm. After this user should be in the same network with AntFarm then open the browser and write IP that was displayed App. App has two screens: Main and About the app.

vadim9999 commented 5 years ago

@atherdon please review my resume in canva

atherdon commented 5 years ago

i think you didn't put all content from canva to your prev comment :(

atherdon commented 5 years ago

looks like on second part you spend more time :) things that I made bold - you need to change or extend or it's just look like poor Russian translation

vadim9999 commented 5 years ago

It's all content. maybe without formatter, it's looking smaller

vadim9999 commented 5 years ago

How can I improve my resume? https://www.canva.com/design/DADfwqsWnzU/E_JD9ibHcD8A-DYZ7JOt3w/edit