전체 글55 [html/css] 반응형 웹 적용하기 - 떽떽대는 개발공부 혼자 웹페이지를 만들다가 반응형 웹에 대해 알게 되어 포스팅한다. 반응형 웹은 모바일 호나경이 시작되면서 장치(device)가 다양해지며 해상도의 크기 및 비율이 제각각 다른 경우가 생기며 발생했는데, 이전에는 동일한 비율(1024x768, 1280x960)에만 대응하면 됐지만, 지금은 비율이 매우 다양해지고 해상도가 높아져서 페이지 설계 시 고려할 사항이 많아졌다. 먼저, 모바일 브라우저에서 시도해야 할 부분은 viewport 이다. 이 부분은 html 에서 meta 태그를 활용하여 viewport 의 크기와 초기 줌 레벨 등을 기기에 맞게 적용되도록 선언하는 것이다. /* header 태그 안에서 사용 */ 위의 부분은 vs code 를 이용하여 html 을 생성하면 자동으로 적용된다. 만약 이 부분.. 2021. 2. 17. [github] .gitignore 를 이용하여 백업파일 무시하기 - 떽떽대는 개발공부 프로젝트를 github 에 업로드 하던 도중 용량이 많은 파일은(ex. react 에서의 node_modules 폴더) 빼고 푸쉬 하게 된다. 그런데 푸쉬 할때마다 이 많은 용량을 차지하는 폴더를 삭제 했다가 푸쉬 후 다시 install 하기엔 비효율적이다. 그래서 git에서 프로젝트를 생성할 때 .gitignore 를 생성하여 백업하지 않을 파일을 지정 해줄 수 있다. 나는 이미 repository 프로젝트가 추가 되어 있었기 때문에 이미 생성된 프로젝트의 최상위 디렉토리에 .gitignore 파일을 생성하고 아래와 같이 작성 해준다. // .gitignore node_modules 위와 같이 작성하고 동일하게 push 해주게 되면 많은 용량을 차지하던 node_modules 폴더는 백업되지 않고 나머.. 2021. 2. 16. [React] react 에서 이미지 적용하기 - 떽떽대는 개발공부 오늘은 react 사용 시 이미지를 적용하는 법에 대해 공부 했다. webpack 공부할 때 왜 공부를 안하고 넘어갔는지.. 후회 했다ㅠ 먼저, file-loader 와 url-loader 를 install 해준다. npm i -D file-loader url-loader 그리고 webpack 에서 output 부분에 publicPath 를 넣어 주어야 한다. output: { filename: "bundle.js", path: path.resolve(__dirname + "/build"), publicPath: '/' }, 이후 webpack : module - roules 부분에 아래와 같이 추가한다. { test: /\.(png|jpg|gif)$/i, use: [ { loader: 'url-load.. 2021. 2. 15. [React] react 에서 로그인 페이지 구현하기(3) - 떽떽대는 개발공부 2021/02/10 - [React] - [React] react 에서 로그인 페이지 구현하기(2) - 떽떽대는 개발공부 [React] react 에서 로그인 페이지 구현하기(2) - 떽떽대는 개발공부 2021/02/09 - [React] - [React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 [React] react 에서 로그인 페이지 구현하기 (1) - 떽떽대는 개발공부 오늘은 리액트를 이용하여 로그인 페이지를 ddeck.tistory.com 이전 글에서 input 란에 입력한 id 와 pw 를 MySQL 에 저장되어 있는 데이터와 비교하여 id 가 존재하는 지, 존재하다면 비밀번호는 일치하는 지 확인하여 결과값을 클라이언트로 전달받아 콘솔에 나타내는 것까지 해 보았다... 2021. 2. 11. 이전 1 ··· 3 4 5 6 7 8 9 ··· 14 다음
