lab.naminsik
  • Javascript, jQuery
  • Reactjs
  • React Native
  • iOS
  • Android
  • AWS
  • Server
  • Html, CSS
  • Php
  • asp .net
  • SQL
  • Word Press
search
keywords
  • Reactjs 2020‧10‧27

    iOS에서 뒤로 가기 전환시 스크롤링 포지션 이슈 (route, scrollTop)

    최근에 react.js 로 구현된 어플리케이션에서 페이지 이동 후 뒤로 가기 위한 행동을 하면 스크롤 포지션이 엄하게 바뀌는 경우를 대처하기 위해 이런 저런 방법을 찾아 본 뒤 원인을 찾게 되었다. iOS에서 앵커 태그(a) 가 아닌 이동일 경우에 생기는 이슈인 듯 하다.예) this.props.history.push('/main');리액트 라우터를 이용해 페이지가 전환되었을 경우 생기는 데 기존 프로젝트에 보니 route에 scrolltop이라는 컴포넌트를 보고 […]

  • Reactjs 2017‧07‧21

    리액트 라우터 v4 와 코드 스플리팅

    리액트는 알다시피 한번에 모든 페이지 정보가 스크립트로 들어감. 그러다보니 방문하지 않을 페이지의 코드까지 로드하니 비효율적일 때가 있다. 해당 페이지로 라우팅되었을 때만 그 페이지 코드를 불러오게 해보자. 사용된 모듈은 react, react-dom, react-router-dom 이다. 리액트 라우터는 v4다. app.js (html에서 불러오는 코드 파일이다.) import React, { PropTypes, Component} from 'react'; import ReactDOM from 'react-dom'; import { BrowserRouter , […]

  • Reactjs 2017‧07‧21

    코드 스플리팅을 위한 webpack.config.js , 패키지들

    이번에 webpack3, react router v4로 접하면서 코드 스플리팅을 위한 작업을 했다. 설치한 패키지들은 package.json으로 파악하고 설치하면 된다. package.json 의 설치 모듈들 devDependencies": { "babel-core": "^6.25.0", "babel-loader": "^7.1.1", "babel-preset-env": "^1.6.0", "babel-preset-es2015": "^6.24.1", "babel-preset-react": "^6.24.1", "babel-preset-stage-0": "^6.24.1", "express": "^4.15.3", "html-webpack-plugin": "^2.29.0", "webpack": "^3.3.0" }, "dependencies": { "react": "^15.6.1", "react-dom": "^15.6.1", "react-router-dom": "^4.1.2" } webpack.config.js const webpack = require('webpack'); […]

popular

  • 풀사이즈 배경으로 동영상 or 이미지 삽입하기
  • [회고] Github Actions가 갑자기 안된다. (Waiting for a runner to pick up this job…)
  • php- 날짜 비교 개월 수로 표현하기
  • 글 쓰기 편한 에디터 TinyMCE Advanced
  • map 역순으로 처리 (배열 역순)
  • 로고디자인 - 블랙과 화이트 색상을 이용한 심플한 로고 디자인 모음
  • JS - datepicker(jQueryUI,달력) 이용시 두개 날짜 범위 설정
  • 동영상 스트리밍 서비스 구축 (AWS s3/cloudFront, HLS, video.js)
  • codedeploy - npm: command not found
  • 2013 웹디자인 트렌드에 관한 인포그라픽

comment

  • 감사합니다!
  • 감사합니다~
  • 잘 해결 되셨다니 다행입니다!...
  • 정말 감사합니다. 덕분에 해결했습니다!...
  • 유용한정보 대단히 감사합니다....