본문 바로가기

Web29

data structures 내가 스택과 큐를 이해하고자 한 이유는 컴퓨터의 동작원리를 본 뒤에 다른 것을 보고 그것을 이해하려면 data structures를 배워야 할 것 같아서! 컴퓨터의 동작원리는 내용이 너무너무 많아서 조금 더 정리를 한 뒤에 포스팅을 하려고 한다. Stack(스택)과 Queue(큐)는 가장 기본적인 개념이다. 추가로 Heap(힙)에 대해서 알아보자! 👋 이 포스팅은 복습하려고 쓰는 것이기에 개념을 다지기엔 괜찮을지 몰라도, 더 깊은 내용을 알기에 적합하지 않는 포스팅 입니다! Stack 스택의 특징을 우선적으로 들어보자면 메모리 크기가 정해져있다 (정적이다.) 추가는 ⭕️, 메모리가 줄어들진 않는다. 입구와 출구가 나눠져있지 않다. 메모리 부족 할 수도 int, boolean, double '쌓는다'의 의.. 2020. 7. 10.
laka project3 for in & concat & localStorage & toLocaleString & fetch 주소 & 수량과 합계 20.06.02 for in & concat for in 객체의 프로퍼티명을 열거하는 반복문 for문과 동일하지만 for문보다 간단하게 작성이 가능하다. const arr = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] for(let i=0; arr.length>i; i++){ console.log(i) } for(let i in arr) { console.log(i) } //console.log의 결과값은 동일하다. javascript for in 문 Concat 기존의 배열에 내가 추가하고 싶은 값을 추가해서 리턴해주는 method const arr = [1, 2, 3, 4, 5] const newArr = arr.concat(['일', '이', '삼', '사', '오']) console.. 2020. 6. 28.
laka project2 삼항연산자 & overflow-y & checkBox & warningM & password regex & callback in EventListener 20.05.28 스크롤 박스 & 삼항연자 BE에서는 하나의 기능을 하는게 앱이라고 한다. 스크롤 박스 overflow-y : y축에 대항하는 스크롤 바, 내부의 content가 박스를 넘지않으면, 스크롤바가 없고 박스를 넘으면, 스크롤 바가 생김. .productWish{ min-width: 360px; max-width: 360px; height: 110px; overflow-y: auto; 삼항연산자 display속성이 cup(조건식)인데 이것이 true(?)라면 'block'으로 false(:)라면 'none style={{ display: cup ? 'block' : 'none' }}> style={{this.state.hello ? {{display: 'block'}} : {{display: '.. 2020. 6. 25.
laka project1 PR & git pull merge | state의 특성 비동기 & ... spread operator & Input name 20.05.25 React 초기세팅 PR & git pull merge table을 이용해서 Sign Up page를 만들어보았다. 라카는 어떻게 만들었는지 궁금해서 개발자 도구를 사용해서 코드를 보았는데 table tag를 사용해서 만들었어서 table tag 손에 익혀둬도 나쁘진 않을 듯해서 나도 써봤다. git branch git branch는 새로운 작업 마다 가지를 만들어주는 것이 좋다. git branch feature/branchName git master pull 과 merge MacBookPro:rocka-frontend $ git pull origin master remote: Enumerating objects: 33, done. remote: Counting objects: 100%.. 2020. 6. 8.
데이터 베이스 데이터 베이스는? 데이터를 저장하는 시스템, 왜 사용할까? 데이터를 저장하고 연산하고 보존하기 위해서 사용 ↔ 메모리 휘발성이다. 하지만, 메모리는 속도가 높다. 저장한 데이터베이스에 저장을 하고 메모리에서 가공처리 파일말고 데이터베이스를 쓰는 이유는 접근과 관리가 편하다. RDBMS, 노시컬 상호연관성 기본 개념. 모든 데이터들은 table로 구성된다. (column(행), row(실제 값 - 고유키가 존재한다.)) 관계형 데이터 베이스 = 엑셀같은 데이터 구조 One to One관계로 한명의 유저는 하나의 프로파일 아이디만 가질 수 있다. One to Many관계는 1대 다, 하나의 정보를 여러개의 데이터가 연결관계를 지을 수 있다. 해당 예시는 고객이 여러번의 주문을 할 수 있듯, 주문에 여러개가 .. 2020. 6. 3.
React Basic React 쉽게 돔에 접근하고 쉽게 조작하기 위해서 만들어진 라이브러리로 오로지 view(보여지는 것들)만 담당한다. Vue와 앵귤러(MVC)는 보여지는 것 외에도 데이터 까지 관리를 한다. 생태계가 활성화 되어있다. 복잡한 규모의 애플리케이션을 조금 더 효율적으로 관리할 수 있는 JS라이브러리. CRA : Create React App //CRA 명령어 cd 내가 원하는 디렉토리로 이동해서 npx creat-react-app projectName //CRA설치 CRA를 설치하기 이전에 뭐가 설치해 있어야하지? node랑 npm(node pacage manager)이 왜 필요해? :: JSX는 브라우저에서 읽을 수 없기에 node기반 패키지를 통해 브라우저가 읽을 수 있는 JS파일로 변환. react-f.. 2020. 6. 1.
react#5 API를 array.map을 사용한 table Bootstrap react-boostrap은 프론트엔드 스타일 시트 라이브러리이다. react.js에서 부트스트랩을 사용시 react-bootstrap을 사용한다. react-bootstrap이 react.js프로젝트에서 모든 부트 스트랩 기능을 제공한다. bootstrap install in terminal cd myProjectFile npm istall react-bootstrap index.js에 import bootstrap import "bootstrap/dist/css/bootstrap.css"; Tables Documentation and examples for opt-in styling of tables (given their prevalent use in JavaScript plugi.. 2020. 5. 29.
리액트#4 input.value받아서 로그인 버튼 이벤트 위의 이미지는 제가 만든 페이지입니다. 무슨일이 발생했죠? id, pw input box안에 value값을 넣어주니 버튼 색상이 변했죠. 우리는 이 기술을 만들어보도록 합시다! (이 포스팅에는 html과 css부터 다루지 않고 기존의 제 코드를 가지고 react로 동작하는 모습을 알려드립니다.) class Login extends Component { //Login Component를 만들어준다. constructor() { //constructor을 사용하면 super(); //항상 super()를 부를 것 super()가 불리지 않으면 this가 초기화 되지 않는다. this.state = { object인 state를 id, pw, 버튼 색상을 변경해주기 위해서 세팅해준다. id: "", //처음에.. 2020. 5. 27.