일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- vscode
- nqueens
- 일상
- grpahQL
- JS
- 코드스테이츠
- JavaScript
- 코딩
- 엔퀸즈
- this
- ftech
- react
- 리액트
- 알고리즘
- 자바스크립트
- 개발
- method
- 클라이언트
- 초보
- 취업
- 연습
- 제일어려워
- 포스기
- DOM
- array
- 해커톤
- Instantiation Patterns
- underscores
- underbar
- 공부
- Today
- Total
목록Be well coding (122)
analogcoding
Web Architecture 웹 서비스는 크게 서버와 클라이언트 (DB)로 구성된다. 웹 서비스 아키텍처는 크데 3가지의 구조로 나누어져있다. 브라우저 위에서 클라이언트가 구동하고 서버에 클라이언트가 무언가를 요청하면 서버가 데이터베이스에서 요청한 것을 찾는다. Client 네트워크를 통하여 서버라는 다른 컴퓨터 시스템 상의 원격 서비스에 접속할 수 있는 응용 프로그램이나 서비스를 말한다. (서비스를 사용하는 사용자 혹은 사용자의 단말기를 칭하기도 한다.) 브라우저 HTML, JS , CSS 등 각 언어로 작성한 코드를 2진수만 알아 들을 수 있는 컴퓨터가 알아볼 수 있게 하는 역할을 가지고 있다. ajax (Asynchronous Javscript and XML) 에이잭스는 비동기적인 웹의 제작을 위..
Toy 03번 문제. 배열의 메소드로 인자로 주어진 배열의 값을 전부 가지고 있으면 true , 아니면 false 를 리턴. this 와 인자로 온 array 를 includes 메소드를 사용해서 판별. 스프린트 N-Queens 만들어놓은 메소드들을 바탕으로 재귀가 어떻게 돌아가는 지에 대해서 그림으로 그려보고 이해하는 것에 시간을 많이 투자했다. 어제 끝내서 여유로울 것 같았지만 전혀 아니였다. 하루만에 복습할 수 있는 양이 아니었다 ㅠㅠ 알고리즘 적으로 문제에 접근할 때 한 방향으로 가다가 잘못되는 순간 나락에 빠지는 것 같다. 다시 헤어나오기가 너무 힘듬.. 자세한 스프린트에 관한 내용은 스프린트에 작성.
현충일이라서 오늘은 세션이 없다. 덕분에 밀린 TIL 블로깅과 N-Queens sprint 를 페어분과 마무리 지었다. 스프린트 카테고리에 정리해서 올릴거지만 수학적인? 알고리즘을 짜보면서 나름 재미를 느꼈다. back bone에 있는 메소드에서 this.get() 을 찾고 순차적으로 만든 함수들에서 최종 알고리즘을 순차적으로 조립한 느낌이었다. 이번 스프린트를 하면서 느낀 나의 대한 피드백은 1. 변수를 자꾸 헷깔려한다. 2. 머릿 속에 그림이 그려지지 않으면 잘 이해하지 못한다. 3. 알고리즘을 생각했지만 코드로 옮기질 못했다. 4. 문제가 발생했을 때 파악하는 능력이 부족하다. - 해결방안 1. 확실하고 헷깔리지 않는 변수 선언. 2. 손으로는 wacom 을 써서든 최대한 그림 그려보기. 3. 수도..
Toy 02번 문제. 문자열이 주어지면 중복되지 않는 유니크한 문자열이 있으면 리턴하고 아니면 null을 리턴. 특정한 문자열의 위치(index)를 반환한다. 시작 기준점이 달라도 하나라면 같은 인덱스에 위치하고 있을 것이므로 indexOf , lastIndexOf 로 해결했다. 스프린트 & 피어 리뷰 이번 스프린트에서 가장 큰 목적을 크게 나열해보자면 1. Class 를 이용한 상속 - 상속받은 기능 외 추가 기능 구현하기. ---> 성공하긴 했다. 다른 기능을 추가하고 기존 기능을 가져오고까지는 성공. 2. 상속받은 메소드를 이용해서 기능 구현하기. ---> 받은 메소드를 활용해서 다른 기능을 구현하는데 어느 것은 성공하고 어느 것은 실패하고.. 반쯤 성공. 3. css 여러 효과 사용해보기. ---..
Toy 01번 문제. 가위바위보 게임에서 input 으로 들어온 숫자만큼 낼 수 있는 경우의 수를 모두 리턴하는 문제. 오늘 못 품~ 풀면 적어주겠따 ㅠㅠ subclass Dance party 스프린트 functional 방식으로 구현된 상속 패턴을 수도클래식컬과 클래스의 방식으로 리팩토링 후 css 해보는 스프린트. 1. pseudoclassical 리팩토링 모습 확인 후 커멘드 달기. pseudoclassical function Dancer (top,left,timeBetweenSteps) { const createDancerElement = function(){ let elDancer = document.createElement('span'); elDancer.className = 'dancer';..
S/A Tree 구조에서 psuedoclassical instantiation 방식으로 map() 메소드를 추가 구현. 체크포인트 리뷰 8. javascript call back 비동기함수에서의 큐 로 인해 리턴 값이 변하는 예제. function foo () { var data = 10; bar(function (players) { data = players; }); return data; } function bar (callback) { // callback함수를 인자로 받고 setTimeout(function () { // setTimeout 에 첫 인자로 그 함수에 인자를 20을 넣어 5초 뒤 실행. callback(20); }, 500); } var result = foo(); function ..
Object.create() 메소드는 객체를 인자로 받아 지정된 프로토타입 객체 및 속성(property)을 갖는 새 객체를 만든다. Object.create() 라는 메소드를 통해서 __proto__ 속성에 직접 접근하지않고 프로토타입 체인을 연결할 수 있다. (proto 매개변수가 null 또는 객체가 아닌 경우 TypeError 가 발생한다. Class class는 javascript 에서 클래스 기반 언어를 사용하지 않지만 편의를 위해? ES6 에서 도입된 문법이다. (ES6의 class 키워드는 겉은 class 이더라도, 내부적으로 프로토타입 기반으로 구성되어있다.) prototpye 과 class 의 차이를 코드로 먼저 보자면 거의 비슷하지만 다른 class 기반 언어처럼 적어 사용한다. 확실..
1. __proto__, constructor, prototype 의 관계 prototype 이란 함수와 new 를 통해 원본 함수를 상속 받는 new 인스턴스를 생성하는 것. 예시 코드 function Car(name,price){ this.name = name this.price = price } var morning = new Car('morning',1) // = > Car {name: "morning", price: 1} 같은 프로퍼티를 참조하는 상속 객체를 쉽게 만들어낼 수 있고 function Morning(){} Morning.prototype.price = 1; Morning.prototype.size = 'small' var Mo1 = new Morning() // Morning{} v..