반응형

전체 글 40

배열(Array) 과 Object(객체) 에 대해 알아보자

Array (배열) 데이터를 리스트 같이 저장하는 곳 배열을 생성할 때 사용하는 리스트 형태의 고수준 객체 Array 자주 사용하는 연산 배열 만들기 let fruits = ['사과', '바나나'] console.log(fruits.length) // 2 인덱스로 배열의 항목에 접근하기 let first = fruits[0] // 사과 let last = fruits[fruits.length - 1] // 바나나 배열의 항목들을 순환하며 처리하기 fruits.forEach(function (item, index, array) { console.log(item, index) }) // 사과 0 // 바나나 1 배열 끝에 항목 추가하기 let newLength = fruits.push('오렌지') // ["..

JavaScript 데이터 타입(Data Type)

자바스크립트 7가지 데이터 타입이 있다. Boolean Type 논리형 True or False 소문자로 씀 " " 없이 씀 -> 왜냐하면 이거는 text가 아니기 때문 true = 1, false = 0 const what = true; Null Type 의도적으로 변수에 값이 없다는 것을 명시할 때 사용 const test = null; console.log(typeof test === null); // false console.log(test ==== null); // true Undefined Type 어떤 변수를 만들고 ①그 값을 정의해주지 않았을때 ② 존재하지 않는 객체 프로퍼티에 접근할 경우 undefined가 반환 Number Type 숫자 배정밀도 64비트 이진 형식 IEEE 754 값(..

let, const, var 차이

let block-scoped 변수 재선언은 할 수 없지만 재할당이 가능 let을 이용하여 선언한 변수는 글로벌 객체에 입력 안됨 let name = 'apple' console.log(name) // apple let name = 'orange' console.log(name) // Uncaught SyntaxError: Identifier 'name' has already been declared name = 'banana' console.log(name) //banana let은 hoisting은 되지만 error를 발생한다 let은 초기 값을 할당하지 않으면 undefined가 초기 값으로 할당된다. let a; console.log(a) // undefined hoisting은 되지만 error..

서버사이드 렌더링(SSR) & 클라이언트 사이드 렌더링(CSR) 장단점

렌더링 이란 요청해서 받은 내용을 브라우저 화면에 표시하는 것 렌더링 과정 Loader 가 서버로 부터 정보들을 불러옴 파싱을 통해 문서를 DOM 트리로 만듬 DOM 트리가 구축되는 동안 브라우저는 렌터 트리를 구축 CSS 설정/레이아웃 위치 지정 렌터링 트리가 그려짐 서버사이드 렌터링(SSR) ssr은 페이지 이동할 때마다 새로운 페이지를 요청 한다. 모든 탬플릿은 서버 연산을 통해서 렌더링하고 완성된 페이지 형태로 응답한다. 장점 검색엔진 최적화(SEO) 가능 서버 사이드 렌더링을 통해 얻을 수 있는 가장 큰 장점 이다. 성능개선 첫 렌더링된 html 을 클라이언트에게 전달해 주기때문에 초기로딩속도를 많이 줄여줄 수 있다. 자바스크립트 파일을 불러오고 렌더링 작업이 완료되기 전에 사용자가 사이트 컨텐..

자바스크립트 Promise 이해하기

Promise 프로미스는 비동기 작업을 할 때 미래의 완료 또는 실패와 그 결과값을 나타낸다. 비동기 처리 : 특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성 Promise가 왜 필요한가? 프로미스는 주로 서버에서 받아온 데이터를 화면에 표시할 때 사용 $.get('url 주소/products/1', function(response){ }) 데이터를 받아오기도 전에 마치 데이터를 다 받아온 것 마냥 화면에 데이터를 표시하려고 하면 오류가 발생하거나 빈 화면이 뜬다. 이와 같은 문제점을 해결하기 위한 방법 중 하나가 프로미스 프로미스 코드 - 기초 먼저 아래 간단한 ajax 통신 코드 이다. function getData(callbackFunc){ $.get(..

출력(Output), 상수(Constant)

메인 함수란? /* 예시 */ using System; namespace HelloWorld { class Program { static void Main(string[] args) { Console.WriteLine("Hello World!"); } } } 시작정(Entry Point) C# 프로그램은 반드시 어떤 함수에서부터 실행되어야 함 그 '어떤'함수가 바로 Main 함수(함수라는 표현 대신 메서드라고도 함) exe 파일을 실행하면, 이 함수가 자동으로 실행 됨 staic 전역 함수만 된다는 것만 기억 OOP와 상관없다는 것만 기억 string [] args 메인 함수가 외부로부터 받는 데이터 이걸 함수 인자(function argument/parameter)라고 부름 메서드 인자라고도 불리기도 ..

소소한 개발/C# 2022.01.28

카카오톡 OG(Open Graph) 캐시 삭제

카카오톡에서 링크를 공유할 때 메타태그 og:image를 통해서 변경하는데 새로운 이미지를 적용하고 난 후 이전 캐시를 삭제해줘야 변경된 이미지가 적용되어 나온다. 새로운 이미지를 적용 했는데 캐시 때문에 이미지가 변경 안된 상태 적용방법은 간단하다. 1. https://developers.kakao.com/tool/clear/og 카카오계정 로그인 여기를 눌러 링크를 확인하세요. accounts.kakao.com 2. URL 을 입력하고 초기화 요청 버튼 클릭 3. 카카오톡을 확인하면 이전 캐시가 삭제되어 이미지가 변경된 걸 확인할 수 있다.

사이트 태그로 구글 애널리틱스(Google Analytics) 연동하는 방법 (코드 삽입)

구글 애널리틱스로 블로그 연동은 하였을 것이다. 만약에 안 했다면 참고하시길 https://myungmin.tistory.com/16 구글 애널리틱스 (Google Analytics) 티스토리 등록 하기 티스토리 블로그 개설 후 실시간 접속자 수, 인기가 많은 글, 방문자의 접속 운영체제 및 디바이스 등 다양한 정보들이 궁금하여 구글 애널리틱스를 등록 하기로 하였다. 구글 애널리틱스 란? 구 myungmin.tistory.com 1. 구글 애널리틱스에서 데이터 스트림 세부 정보 버튼 클릭 2. 웹 스트림 세부 정보에서메타태그 복사 3. 티스토리 블로그 관리자 접속 후 스킨 편집 클릭 4. html 편집 클릭 5. 구글 애널리틱스에서 복사한 메타태그 추가 적용 6. 구글 애널리틱스를 확인하면 조회 수가 집..

구글 애널리틱스 (Google Analytics) 티스토리 플러그인으로 등록하기

티스토리 블로그 개설 후 실시간 접속자 수, 인기가 많은 글, 방문자의 접속 운영체제 및 디바이스 등 다양한 정보들이 궁금하여 구글 애널리틱스를 등록하기로 하였다. 구글 애널리틱스 란? 구글 애널리틱스는 현재 구글 마케팅 플랫폼 브랜드 내의 플랫폼으로서, 웹사이트 트래픽을 추적하고 보고하는 구글이 제공하는 웹 애널리틱스 서비스 구글 애널리틱스 연동 방법 1. 구글 애널리틱스 홈페이지 analytics.google.com/analytics/ Redirecting... analytics.google.com 2. 구글 애널리틱스 홈페이지 구글 아이디로 로그인 3. '무료로 계정 만들기' 버튼 클릭 4. 계정 설정 - '새 계정 이름' 입력(필수) 나는 그냥 tistory 라고 했다. 계정 이름을 입력 후 다음..

프로그래밍 언어의 분류

저수준 언어 vs 고수준 언어 저수준 언어(low-level language) 고수준 언어(high-level language) 컴퓨터가 이해하기 쉬운 언어 인간이 이해하기 쉬운 언어 0과 1로만 이루어짐 인간이 사용하는 언어로 이루어짐 예)for, while, if 기계어(machine code) 어셈블리어, C, C++, Java, C# 컴퓨터가 바로 이해하므로 변환 과정이 필요 없음 컴퓨터가 이해하는 '기계어'로 변환 하는 과정이 필요 컴퓨터가 이해하기 쉬운 언어에 가까울수록 저수준 인간이 이해하기 쉬운 언어에 가까울수록 고수준 저수준 언어, 고수준 언어의 정의는 상대적 기계어 보다 쉬운 어셈블리어(Assembly Language)가 나오지만 엄밀히 말하면 고수준 언어이지만 아직도 사람이 읽기에 힘..

소소한 개발/C# 2022.01.26
반응형