Morioh
Login
React Components

React Components

3 years ago

Korea Polytechnic University Graduation Works Team Repository

Sanki University graduation work team repository

url : http://sehwan96.com.s3-website.ap-northeast-2.amazonaws.com/

  • Directory organization
/
front_codes
    - react-app
    README.md
backend_codes
    - platfrom code
    REAMDE.md
test_codes
    - 테스트 디렉터리들
  • In the master branch, each branch works.
  • Branch convention: {contents}/{parts}/{details}
  • There are a total of 4 contents. feature, bugfix, hotfix, enhancement
  • 예제 : feature/front/add-react-app
  • 예제 : feature/back/fix-aws-resources
  • When your work is done, push to your branch and write a PR.
git branch feature/back/fix-aws-resources
git checkout feature/back/fix-aws-resources
git pull origin master --rebase
- 본인의 작업 실시 -
- 완료 되었을 경우-
git add *
git commit -m "add some validation logic"
git push origin feature/back/fix-aws-resources
- 이후 깃헙에 들어가서 PR 작성 및 리뷰 리퀘스트 -
  • Receive a review from the team leader (Kim Se-hwan) and merge the PR.

distribute

  • The front code is automatically deployed and deployed using the github action. (Whenever a push event occurs on the master branch, it is uploaded to the S3 bucket)
name : React build 
on : 
   push :                                ## Run only when a push event occurs in the master branch 
    branches :
      - master

jobs:
  build:
    runs-on: ubuntu-18.04
    steps:
      - name The : Checkout, the Source code.   ## Check out repository 
        uses : actions/checkout@master

      - name: Cache node modules      ## node modules 캐싱
        uses: actions/cache@v1
        with:
          path: front_codes/my-app/node_modules
          key: ${{ runner.OS }}-build-${{ hashFiles('**/package-lock.json') }}
          restore-keys: |
            ${{ runner.OS }}-build-
            ${{ runner.OS }}-

      - name: Display the path
        run: pwd && ls

      - name The : the Change Directory ## directory, moving 
        the Run : the CD front_codes / My-the App

      - name The : the Install the Dependencies     ## dependent files installed 
        the Run : the CD front_codes / My-npm the install the App &&

      - name: Build                   ## React Build
        run: cd front_codes/my-app && npm run build

      - name: Deploy                  ## S3에 배포하기
        env:
          AWS_ACCESS_KEY_ID: ${{ secrets.AWS_ACCESS_KEY_ID }}
          AWS_SECRET_ACCESS_KEY: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
        run: |
          aws s3 cp \
            --recursive \
            --region ap-northeast-2 \
            front_codes/my-app/build s3://sehwan96.com ##

Skill stack used

  1. AWS
  • DynamoDB
  • RDS(Postgresql)
  • Lambda
  • GreenGrass
  • Appsync
  • GraphQL
  • Amplify
  • S3
  • CloudWatch
  1. Front
  • React.js
  • Material UI
  • D3.js
  • webpack
  • yarn
  • above sea level
  1. DevOps
  • Jenkins
  • Serverless(with AWS)
  • Docker(Greengrass Deploy)

Google Python Coding-Style Translation (Translator Se-Hwan Kim)

Original: https://google.github.io/styleguide/pyguide.html

1 Background

Python is a very active main language language at Google. This style guide has listed do’s and don’ts for coding Python.

To make coding auto-formatting accurate, I created a setting file for Vim (for Vim users).

" Copyright 2019 Google LLC
"
" Licensed under the Apache License, Version 2.0 (the "License");
" you may not use this file except in compliance with the License.
" You may obtain a copy of the License at
"
"    https://www.apache.org/licenses/LICENSE-2.0
"
" Unless required by applicable law or agreed to in writing, software
" distributed under the License is distributed on an "AS IS" BASIS,
" WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
" See the License for the specific language governing permissions and
" limitations under the License.

" Indent Python in the Google way.

setlocal indentexpr=GetGooglePythonIndent(v:lnum)

let s:maxoff = 50 " maximum number of lines to look backwards.

function GetGooglePythonIndent(lnum)

  " Indent inside parens.
  " Align with the open paren unless it is at the end of the line.
  " E.g.
  "   open_paren_not_at_EOL(100,
  "                         (200,
  "                          300),
  "                         400)
  "   open_paren_at_EOL(
  "       100, 200, 300, 400)
  call cursor(a:lnum, 1)
  let [par_line, par_col] = searchpairpos('(\|{\|\[', '', ')\|}\|\]', 'bW',
        \ "line('.') < " . (a:lnum - s:maxoff) . " ? dummy :"
        \ . " synIDattr(synID(line('.'), col('.'), 1), 'name')"
        \ . " =~ '\\(Comment\\|String\\)$'")
  if par_line > 0
    call cursor(par_line, 1)
    ifpar_col ! =  col ( " $ " ) -  1 
      return par_col
     endif 
  endif

  " Delegate the rest to the original function.
  return GetPythonIndent(a:lnum)

endfunction

let pyindent_nested_paren="&sw*2"
let pyindent_open_paren="&sw*2"

(We won’t write)

2 Python rules

2.2 Imports

import The syntax is not used to import each class or function,

Justice

It is a reusable mechanism for sharing code from that mod to other modules.

Advantages

The rules for namespace management are very simple. The source of each identifier is represented in an intuitive way. x.ObjIs

Obj Means that an object called is defined in a module called x.

Disadvantages

Module names can conflict. And the names of some modules can be inconveniently long.

recommend
  • import xShould be used to import packages and modules
  • from x import yIs xa package prefix, and ymeans that the module name, and yused to using a module without the prefix.
  • from x import y as zIs yused to import and use when there are multiple module names, or when the module name y is inconveniently long.
  • import y as zIs only zused when there is a lesser known convention. (numpy to np, or pandas to pd)

For example, it sound.effects.echoshould be imported as follows.

from sound.effects import echo

echo.EchoFilter(input, output, delay=0.7, atten=4)

When importing, the realtive name is not used. Even if modules are in the same package, they are imported using the full package name.

This avoids accidentally importing the package twice.

2.3 packages

Import each module by specifying the full path of the module location.

Advantages

You can avoid collisions caused by incorrect imports or names of modules that occur by navigating the module path differently from the developer’s expectations.

Disadvantages

As you develop, you make code distribution difficult by modifying the package hierarchy. However, this is not a problem for the modern deployment process.

recommend

Newly developed code must be imported by specifying the full package path.

YES:

## Reference absl.flags in code with the complete name (verbose).
import absl.flags
from doctor.who import jodie

FLAGS = absl.flags.FLAGS
## Reference flags in code with just the module name (common).
from absl import flags
from doctor.who import jodie

FLAGS = flags.FLAGS

NO:(This file is in the doctor/who directory, assuming the jodie.py file is also in this path)

## Unclear what module the author wanted and what will be imported.  The actual
## import behavior depends on external factors controlling sys.path.
## Which possible jodie module did the author intend to import?
import jodie

This sys.pathmay not be a problem because it will find the path and import the module, but it may not be possible depending on the environment. The Python package import process first looks for third-party or top-level packages, then local packages, so jodie.pymay not be imported correctly.

2.4 Exceptions

Exceptions are allowed in Python, but exception handling must be used with care.

Justice

Exceptions are created to handle errors or exception conditions that break the normal code flow or code control.

Advantages

Exception handling code has the advantage of not breaking the general code flow and process when an exception occurs.

Disadvantages

Exception handling code can confuse the general process and flow. It’s easy to miss errors when making library calls (It told me to use branch statements instead of exception handling code as much as possible,)

recommend

Exceptions must be used with certain conditions.

  • Use the built-in (built-in) exceptions only when it really makes sense. For example ValueError, raises for values ​​that do not pass the precondition (e.g., if only positive values ​​have to be entered, but -precondition- an ValueErrorexception occurs if the input is negative ).
  • assertDo not use the syntax to check arguments in public APIs. assertThe syntax is used for internal checks, not to confirm correct use or unexpected results.
Yes:
  def connect_to_next_port(self, minimum):
    """Connects to the next available port.

    Args:
      minimum: A port value greater or equal to 1024.

    Returns:
      The new minimum port.

    Raises:
      ConnectionError: If no available port is found.
    """
    if minimum < 1024:
      ## Note that this raising of ValueError is not mentioned in the doc
      ## string's "Raises:" section because it is not appropriate to
      ## guarantee this specific behavioral reaction to API misuse.
      raise ValueError(f'Min. port must be at least 1024, not {minimum}.')
    port = self._find_next_open_port(minimum)
    if not port:
      raise ConnectionError(
          f'Could not connect to service on port {minimum} or higher.')
    assert port >= minimum, (
        f'Unexpected port {port} when minimum was {minimum}.')
    return port
  def connect_to_next_port(self, minimum):
    """Connects to the next available port.

    Args:
      minimum: A port value greater or equal to 1024.

    Returns:
      The new minimum port.
    """
    assert minimum >= 1024, 'Minimum port must be at least 1024.'
    port = self._find_next_open_port(minimum)
    assert port is not None
    return port

Further explanation

  • The minimum received as an argument is treated as a conditional statement in YES, and if it is not correct, a rasie exception is issued. Do not use the assert statement.

  • Libraries and packages have their own exceptions. These exceptions are implemented by inheriting the existing exceptions.

  • The exception name must Errorend with.

  • Never except:use syntax to catch all exceptions . ( ExceptionOr StandardError)

  • If you use it as above, you will catch all exceptions such as typos, interrupts, shutdown calls, etc., making it difficult to find the desired error.

  • try/exceptBlocks in the syntax must be short. That way, you won’t catch other exceptions that the developer didn’t predict (write try, except short for each debugging point)

  • finallyIt is recommended to use sentences. You can use the syntax to handle when no exception occurs. This is useful in situations such as cleanup and closing files.

Global variables

Refrain from using

2.5.1 Definition

Variables defined as module level or class attribute

Advantages

Sometimes useful

Disadvantages

It has the potential to do something other than what you want while importing. This is because when a module is imported, it becomes a global variable assignment.

recommend

Avoid using global variables as much as possible.

However, module level constants are allowed and recommended. For example MAX_HOLY_HANDGRENADE_COUNT = 3, constants are all capitalized and used as underscores.

If used, it is assigned immediately when the module is imported, and is _used with prefixed to prevent malfunction .

Comprehension and Generator

Okay for simple cases

Justice

Lists, dictionaries, three Comfrey hensyeon the generator, generator expressions map(), filter(), lambdauseful because it’ll make the air conditioner not datatypes not use or iterator

Advantages

Simple comprehensions make the logic for creating lists, dictionaries, and sets simpler and cleaner. Generator expressions are also very useful (if you don’t have to make all the lists and you can break them in the middle).

Disadvantages

Complex comprehensions and generators are less readable

recommend

Use only for simple cases. Complex logic should use loops and loops

Yes:
  result = [mapping_expr for value in iterable if filter_expr]

  result = [{'key': value} for value in iterable
            if a_long_filter_expression(value)]

  result = [complicated_transform(x)
            for x in iterable if predicate(x)]

  descriptive_name = [
      transform({'key': key, 'value': value}, color='black')
      for key, value in generate_iterable(some_input)
      if complicated_condition_is_met(key, value)
  ]

  result = []
  for x in range(10):
      for y in range(5):
          if x * y > 10:
              result.append((x, y))

  return {x: complicated_transform(x)
          for x in long_generator_function(parameter)
          if x is not None}

  squares_generator = (x**2 for x in range(10))

  unique_names = {user.name for user in users if user is not None}

  eat(jelly_bean for jelly_bean in jelly_beans
      if jelly_bean.color == 'black')
No:
  result = [complicated_transform(
                x, some_argument=x+1)
            for x in iterable if predicate(x)]

  result = [(x, y) for x in range(10) for y in range(5) if x * y > 10]

  return ((x, y, z)
          for x in range(5)
          for y in range(5)
          if x != y
          for z in range(5)
          if y != z)

Basic iterators and operators

Using basic iterators and operations on lists, dictionaries, and files

Justice

Membership test operators (in, not in) and iterators defined on container data types (lists, dictionaries)

Advantages

Basic iterators and operations are very efficient and simple.

recommend
Yes:  for key in adict: ...
      if key not in adict: ...
      if obj in alist: ...
      for line in afile: ...
      for k, v in adict.items(): ...
      for k, v in six.iteritems(adict): ...
No:   for key in adict.keys(): ...
      if not adict.has_key(key): ...
      for line in afile.readlines(): ...
      for k, v in dict.iteritems(): ...

Download Details:

Author: kimsehwan96

Demo: http://sehwan96.com.s3-website.ap-northeast-2.amazonaws.com/

Source Code: https://github.com/kimsehwan96/car-iot-platform-from-kpu

#react #reactjs #javascript

Korea Polytechnic University Graduation Works Team Repository
2.05 GEEK