Jerry

SideProject 오늘은 CSS 작업을 하였다. CSS가 아닌 SCSS(SASS)를 이용하였다. Header → Main → Login → SignUp → Cart → Item Info 순 위 순서대로 하려고 했는데, 하다보니 Header, Main, Cart, Item Info 페이지 순으로 했다. 못한 Login, Signup 페이지는 다음날 계속 이어서 할 예정이다. 예전에 SCSS를 처음 접할 땐, 익숙하지 않았는데 이번에 다시 복습하고 적용해보니 저번보단 유연하게 현재 개발코드에 적용시킨거 같아서 재미있었다. 모르거나 어려운 문제일수록 자주보고 오래보면 자연스럽게 알게 되는거 같다!

Project https://juicyjerry.tistory.com/229

SideProject - React로 NodeBird SNS 만들기 (Hello, Next.js & antd 사용해 SNS 화면 만들기), 2.3 referer 이전 페이지, opener: 누가 나를 열었는지 Made by Jaylee 리액트에서 배열에서 jsx 사용할 땐 키 적어줘야 한다. onFinish - antDesign에서 form은 새로고침 안 되게 되어있어서(이미 적용) preventDefault()를 하지 말아야한다. 리액트 리렌더링은 해당 함수를 전체를 다시 렌더링하지만, 실제로는 바뀐 부분만 리렌더링된다. return 부분을 virtualDOM이라고 생각, 리액트에서 리턴 한번그려줘요, 이전 virtualDOM과 현재 virtualDOM을 비교해서 달라진 부분을 리액트에 알려줘 그 부분..

Project https://juicyjerry.tistory.com/227

Side Project 오늘은 회원가입 페이지, 장바구니 페이지, 상품 정보 페이지에 대한 레이아웃을 마크업하는 작업을 진행했다. 그 후, PM2로 nodeJS가 백그라운드에서 실행하도록 할 수 있게 설정하였고 aws s3를 활용한 클라이언트를 배포를 띄우는 것까지 완료를 하였다. 그 후 todolist상에는 CSS 작업을 하기로 했는데, 문득 CSS작업을 먼저할지 리액트 작업과 같은 framework를 적용할지 고민이 되었다. 배운 점 1. s3로 클라이언트 배포를 진행하는 과정에의 고민 s3로 클라이언트 배포를 진행하는 과정에서 react로 코드를 짠 상황에서는 npm build를 이용해 build를 진행 후 클라이언트에 배포하면 되지만, 나는 html로만 정적페이지를 구성해놓은 상황이라 순간 멘붕이..

CS 공부 https://juicyjerry.tistory.com/224 Project https://juicyjerry.tistory.com/225

Side Project 오늘 프로젝트 진행 목표는 layout 마크업 작업과 그 후 S3를 활용해서 만든 마크업을 배포까지 하는 것을 목표로 하였다. 프로젝트말고 다른 공부도 같이해서 그런지 시간 배분을 잘 못 했던 거 같다. 내일부터는 1순위로 먼저 끝내도록해야겠다. 각 페이지마다 들어가는 Header 부분과 랜딩 페이지, 로그인 페이지 마크업 작업만 하고 깃헙에 푸시하고 마무리하였다. 아쉬웠던 점 각 페이지 마크업 작업할 때마다 브랜치 땋고 pr 날리고 merge하는 과정에서 단순하게 index.html 파일 하나만 merge하고 있었다. 다행히 큰 문제 없게 알아채서 다행이지만 기본적인 실수를 해서 아쉬웠던 부분이었다. 눈치챈 후 index.html 파일명 대신 각 페이지 이름으로 rename 하였다.

6장 웹 1. 브라우저에 대해서 이야기해보겠습니다. 브라우저가 하는 일은 HTML에 적힌대로 정보를 보여주고, CSS에 적힌 대로 디자인을 입혀주며, JavaScript에 적혀있는 그대로 동작합니다. 크롬은 대표적인 브라우저 중 하나로 다운을 받아 설치하여 사용할 수 있습니다. 다만, 여기서 다운을 받아 설치를 해야된다는 것은 어떤 의미가 있을까요? 그것은 바로 크롬이 '애플리케이션'이라는 것입니다. (다른 브라우저들도 마찬가지입니다) 브라우저 버전의 파편화 애플리케이션은 사용하는 사람에 따라서 버전이 다를 수 있고 브라우저 자체도 다를 수 있습니다. 각 브라우저는 서로 다른 애플리케이션이기 때문에 브라우저에 따라 그 안의 구현 방식이 달라 HTML, CSS, JavaScript의 특정 기능이 버전별로 ..