積小成大:티끌 모아 개발

JS 스터디 2주차객체 구축 연습(Object building practice)https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object_building_practice기본 설정1. HTML과 CSS, JavaScript로 기본적인 공 애니메이션을 구현 2. 공들이 화면에서 튕기고 충돌 시 색상이 변경 기본 캔버스 설정우선 제공되는 js를 살펴보면 캔버스의 크기를 브라우저의 전체크기로 설정해주고 난수를 생성, 랜덤 색상을 생성하는 도우미 함수 정의까지는 되어 있는 상태. 난수 생성 함수는 공의 위치, 속도, 색상 등을 무작위로 설정하기 위해 사용된다.Ball 클래스 정의 우선 공의 속성을 정의해준다.공의 위치나 속도, 색상, 크기등을..

인프런 강의가 너무 기초에 가까워서 스터디원들과 상의한 후 mdn web docs에 있는 문제를 보고주어진 조건에 따라 코드를 작성하는 방식으로 바꾸었다. IDE는 내가 사용하던게 제일 간편해서 인텔리제이에서 작업 할 예정이다.-원본-https://developer.mozilla.org/ko/docs/Learn/JavaScript/Building_blocks/Image_gallery기본 설정1. 디렉토리를 하나 만든다.2. 해당 디렉토리 안에 index.html과 main.js. 두개의 파일을 생성한다.3. main.js를 참조하는 html에  아래 파일을 다운받으면 HTML, CSS 모두 작성이 되어있기 때문에우리는 JS파일만 수정하면 된다.이미지 순회하기반복문. 즉, for문을 사용해서 thumb-b..

처음에 목표했던 CS관련 지식 스터디가 종료되고 무엇을 시작할까 동기들과 고민했었다. 물론 지난 반년간 공부한 지식으로는 아직 한참 모자라고,알아야하고 배워야하는 것은 더 많지만 취업준비중이 아닌 다들 현업에서 일을 배우고 있는 상황이기에공통적으로 필요한 것을 우선적으로 시작하게 되었다. 현업에서 JS를 사용하고는 있지만 울며 겨자먹기로 고차원적인 내용부터맨땅에 헤딩을 하고 있으니 기초부터 다시 해보는걸로! 기본적인 자료형, 조건반복문은 제외하고 연습문제나 실습 위주로 작성해보려고 한다. 강의 자료는 인프런으로 한다.학습명 : 쉽고 자연스럽게 배워보는 Javascript 입문 - 코드스쿼드 마스터즈 코스레벨 1연습문제1 1. 두 수를 입력받아 사칙연산의 결과를 표시해본다.    2. BMI를 계산하는 프..

CS 스터디 16주차 옵저버 패턴 & 스트레티지 패턴  &  컴포지트 패턴별로 중요한 패턴들은 아니라 한번에 다루게 되었다.주요 정리만 하고 넘어 갈 예정이다. 옵저버 패턴 옵저버 패턴은 객체의 상태 변화를 관찰하는 옵저버들(리스너)에게 그 변화를 알리는 디자인 패턴으로 주로 이벤트 기반 시스템에서 사용된다. 주체(Subject)와 옵저버(Observer) 로 구성되어 있고 주체는 상태를 관리하고 옵저버는 주체의 상태 변화를 감지하는 특징이 있다.이 두가지 구성은 서로 느슨하게 결합되어 있기 때문에 주체는 옵저버의 구체적인 구현을 알 필요가 없다.이러한 느슨한 결합의 특징은 새로운 옵저버를 쉽게 추가할 수 있도록 확장성이 높은 특징을 가진다. 옵저버 패턴의 사용방법우선 두개의 클래스와 하나의 인터페이스가..

CS 스터디 15주차 싱글톤 패턴싱글톤 패턴(Singleton Pattern)싱글톤 패턴은 다양한 디자인 패턴 중 하나로 한 클래스에 대해서 단 하나의 인스턴스만 존재하도록 보장하는 패턴이다.어플리케이션에서 전역으로 접근 가능한 인스턴스를 제공하여 상태나 행위를 공유할 때 유용하고,주로 설정/로그/데이터베이스 연결 관리 등에서 사용한다. 특정 객체가 애플리케이션 전체에서 일관된 상태를 유지하면서 접근 가능해야하는 경우(설정 관리나 로그 관리) 이 객체들이 동일한 상태를 유지해야 하기 때문에 전역적인 접근성이 좋다. 또한 데이터 베이스에 연결된 객체나 파일 시스템 접근 객체와 같이 비용이 큰 리소스를 관리해야 할 때여러 개의 객체가 생성되는 것을 방지하여 리소스 절약에 효율적이며,중요한 상태 정보를 유지하..

CS 스터디 14주차  팩토리 메서드 패턴 팩토리 메서드 패턴(Factory Method Pattern) 팩토리 메서드 패턴(Factory Method Pattern)은 객체지향 디자인 패턴 중 하나로, 객체 생성의 책임을 팩토리 메서드로 추상화하여 객체 생성의 유연성을 제공하는 패턴이다. 객체 생성 코드를 클라이언트 코드에서 분리하여 객체 생성 과정에서 발생할 수 있는 변경에 쉽게 대처할 수 있도록 해준다. 객체를 생성하기 위한 인터페이스를 정의하고 실제 객체 생성은 서브클래스에서 담당하게 하는 패턴으로 클라이언트 코드와 객체 생성 코드를 분리하고 객체 생성 방식을 변경해도 클라이언트 코드에 영향을 미치지 않게 한다.팩토리 메서드 패턴의 사용방법1. 추상 클래스(인터페이스)정의 생성될 객체들의 공통 인..

CS 스터디 14주차  템플릿 메서드 패턴 템플릿 메서드 패턴(Template Method Pattern) 템플릿 메서드 패턴(Template Method Pattern)은 객체지향 소프트웨어 설계 패턴 중 하나이다. 상위 클래스에서 알고리즘의 골격을 정의하고,  알고리즘의 일부 단계를 하위 클래스에서 구현하도록 하는 패턴으로상위 클래스는 템플릿 메서드를 통해 알고리즘의 주요 단계를 정의하고, 하위 클래스는 이러한 단계를 구체적으로 구현한다. 프론트에서 주로 다루는 타임리프 같은 기능이라고 생각하면 된다.타임리프는 HTML 파일에서 동적으로 데이터를 바인딩하고, 템플릿 상속 등의 기능으로 재사용 가능한 웹페이지를 설계한다.템플릿 메서드 패턴과 이런 개념이 유사한 방식으로 설계되고 사용된다는 점을 대입해서..

CS 스터디 13주차  어댑터 패턴 어느새 첫 목표였던 JAVA 관련 스터디가 모두 끝나고 개발을 하면서 필수적으로 공부해야하는 패턴관련하여 새로운 스터디가 시작되었다. 어댑터 패턴(Adapter Pattern)어댑터 패턴(Adapter Pattern)은 소프트웨어 설계 패턴 중 하나로, 기존 클래스의 인터페이스를 다른 인터페이스로 변환하여 서로 호환되지 않는 인터페이스를 가진 클래스들이 함께 동작할 수 있게 만드는 패턴이다.어댑터 패턴은 주로 기존 코드의 재사용을 목적으로 하며, 특히 시스템을 새롭게 설계하거나 기존 시스템에 새로운 기능을 추가할 때 유용하다. 어댑터 패턴은 두 개의 주요 요소로 구성되어 있는데, 타겟과 어댑터 그리고 어댑티가 있다. 1. 타겟 인터페이스(Target Interface)..

CS 스터디 12주차  Stream APIJAVA StreamJava 8버전 이상부터는 Stream API를 지원하기 시작했다.Stream을 통해 Java에서도 람다를 사용한 함수형 프로그래밍이 가능해졌고 이 부분은 기존의 Collection과 Stream은 데이터 계산 시점에서 차이가 난다. 그럼 Collection이란 정확히 뭐길래? Stream 또 뭐길래? 두가지가 데이터 계산 시점의 차이가 존재한다고 하는걸까. Collection Collection은 모든 값을 메모리에 저장하는 자료구조로 데이터를 추가하기 전에 모든 계산이 완료되어 있어야만 한다.외부 반복을 통해 사용자가 직접 반복 작업을 거쳐 요소를 가져올 수 있으며 예를 들어 for-each 문을 사용할 수 있다.Stream Stream은 ..

CS 스터디 11주차  Error & Exception Error & Exception  프로그래밍에서 "Error"와 "Exception"은 코드 실행 중 발생할 수 있는 문제들을 지칭하는 두 가지 주요 용어이다.이러한 문제들은 프로그램의 흐름을 방해하고, 예상치 못한 결과를 초래하기 때문에 예외처리 등 다양한 방법으로개발자가 오류를 명시적으로 던지거나 잡아주기도 한다. 두 용어는 종종 혼용되기도 하지만, 각각의 특성과 처리 방식에는 분명한 차이가 있다. Throwable 클래스 Java에서 Throwable 클래스는 예외 처리 체계의 최상위 클래스로, 모든 오류(Error)와 예외(Exception)의 슈퍼클래스이다.Throwable 클래스는 Java의 java.lang 패키지에 속해 있으며, 이 클..