본문 바로가기
반응형

분류 전체보기196

백엔드, 프론트엔드가 뭡니까? (ft. 직업특징) 요즘은 IT개발자 출신 대표도 많지만 그래도 비전공자 출신이 많은 것이 현실입니다. 비전공자 출신 중 대부분의 스타트업은 IT서비스를 이용해서 사업을 하려고 하고 기획합니다. 하지만 동업이나 채용을 할 때 용어부터 난관에 부딪힙니다. IT서비스를 통해 사업을 기획하시는 분이라면 프론트엔드, 백엔드에 대한 개념은 필요하다고 생각합니다. 오늘은 통상적으로 말하는 백엔드와 프론트엔드에 대해서 정리해보려고 합니다. 우선 프론트엔드는 사용자가 볼 수 있는 화면, 사용자 인터페이스를 개발하는 영역을 말합니다. 주로 클라이언트 사이드 영역을 말합니다. 웹사이트 화면, 앱 화면 등 내가 보고 건들 수 있는 화면의 기능을 개발하는 영역이라는 설명도 맞겠습니다. 디자이너가 그림이나 레이아웃을 그려서 넘겨주면 그 그림이 작.. 2022. 11. 30.
React.js로 엑셀 다루기, xlsx 웹은 다른 것보다도 디버깅하기 쉽고 툴이 잘되어 있기 때문에 시작하기 쉽습니다. React로 엑셀을 다룰 수 없나 인터넷에 살펴보았습니다. 파이썬의 경우 윈도우즈 프로그래밍으로 할 수 있는 QTPY라는 라이브러리가 있었고 React도 엑셀을 다룰 수 있는 xlsx 라는 라이브러리가 있었습니다. 설치법과 메뉴얼 영문 사이트, xlsx, sheetjs https://docs.sheetjs.com/docs/ Overview | SheetJS Community Edition License docs.sheetjs.com 웹의 특성상 PC, Mobile, Tablet 등 많은 기기에서 바로 접근할 수 있어 원툴로 활용도가 좋은 편입니다. 게다가 이 라이브러리를 쓰면서 쉽게 버튼을 만들고 엑셀이 만들어지는 것을 보고.. 2022. 11. 28.
React.js, 화면 그리기 스타일링 간단한 웹이라도 만들기 위해서는 일단 화면을 구상해야합니다. 화면을 구상하기 위해서는 React.js 이전에 html에 대해서 알아야합니다. 저도 막막했기 때문에 일단 스타일링 속성에 대해서 정리해보겠습니다. 잘 사용하는 것과 헷갈리는 것 위주로 정리하겠습니다. position : 위치를 어떻게 할 것인지 결정하는 것 fixed: element를 브라우저 window에 상대적으로 위치 relative : element를 보통의 위치 기준으로 상대적으로 위치 absolute : element를 절대 위치로 위치 static : 원래의 순서대로 위치 , 기본값 flex-direction : 어떤 방향으로 배치할 것인지 결정하는 것 row: 아이템을 행에 따라 가로로 왼쪽부터 위치 column: 아이템을 열에.. 2022. 11. 27.
웹사이트 만들기,서버 사이드 렌더링(SSR)과 클라이언트 사이드 렌더링(CSR), 검색최적화(SEO) 취미로 계속 개발을 하다가 미니 프로젝트를 하기로 마음먹었습니다. 주식 관련된 것으로 하기로 결정했고 Saas 타입의 프로젝트를 기획할 생각입니다. 우선 빠르게 접근할 수 있는 웹 앱으로 만들기로 했고 React.js를 사용할 예정입니다. 그리고 다음으로 결정해야 할 사항은 서버 사이드 렌더링 (SSR)로 할 것인지 클라이언트 사이드 렌더링(CSR)로 할 것인지 입니다. 서버 사이드 렌더링이란? 선택한 이유 서버 사이드 렌더링이란 브라우저가 매번 데이터를 서버측에서 요청해서 서버에서 연산 후 결과를 브라우저에 보내주는 방식입니다. 특징으로는 초기 로딩 속도가 클라이언트 렌더링보다 빠릅니다. 또 하나의 장점은 검색엔진최적화(SEO)가 가능합니다. 이것 때문에 서버 사이드 렌더링하는 방식으로 방향을 잡았습니.. 2022. 11. 26.
반응형

티스토리툴바