티스토리

개발세발

검색하기

블로그 홈

개발세발

bluepinetree.tistory.com/m

뉼👩🏻‍💻 님의 블로그입니다.

구독자: 11

방명록 방문하기

주요 글 목록

[새싹(SeSAC) 프론트엔드] 14주차 & 마지막 회고 [잘한 점] ☑️ 좋은 마무리를 위해 애쓰기 - 부족한 점이 많았지만 그래도 프로젝트를 마무리하는 과정에서 최대한 좋은 마무리를 하기 위해서 노력했다. 최대한 할 수 있는 만큼 마무리 지으려 노력했고, 최대한 정리된 마무리를 하기 위해서 힘썼다. 책임감있게 끝까지 일을 마무리하고자 노력했다. ☑️ 기능추가하여 완성도 높이기 - 개발을 시작을 백엔드쪽 위주로 했기 때문일까. 프로젝트를 하면서 백엔드 영역이 없으면 자꾸 허전한 기분이 든다. 그래서 이번 프로젝트에서도 약간이라도 백엔드 영역이 추가되었으면 좋겠다는 생각에 nodemailer를 이용하여 메일전송 기능까지 추가하여 구현했다. 구현하는 과정이 쉬울줄 알았으나 생각보다 여의치 않았고, 그와중에 서버/클라이언트 영역을 구분지어 폴더 구조를 잡고 구현하.. 공감수 0 댓글수 0 2023. 1. 29.
[새싹(SeSAC) 프론트엔드] 13주차 회고 [잘한 점] ☑️ 우선순위 정하기 - 확실히 예전보다 우선순위를 정해놓고 실천하는 루틴이 익숙해졌다. 전에는 뭐부터 해야 할지 갈팡질팡할 때가 많았는데, 이번에 여러 일을 처리해야 되는 상황에 자주 놓이게 되면서 우선순위를 설정하는 습관을 조금 더 다지게 되었다. 그리고 우선순위를 정할 때 하기 싫지만 해야 되는 일들을 제일 먼저 앞에 놓고자 계속 노력해오고 있다. 자꾸 하고 싶은 거 먼저 하지 말기! ☑️ 맡은 바 책임지기 - 늦더라도 결국 내가 맡은 바를 끝내긴 한다. 적어도 내가 해야 될 것들을 남에게 떠넘기지 않기 위해서는 계속해서 노력해오고 있다. 여전히 여러모로 부족한 면모가 많아서 후회되고 아쉬울 따름이지만 그럼에도 해야 되는 일을 스스로의 선에서 해결하고자 계속해서 노력하니깐! 이것만은 유.. 공감수 1 댓글수 0 2023. 1. 15.
[새싹(SeSAC) 프론트엔드] 12주차 회고 [잘한 점] ☑️ 꾸준히 일정관리 - 새싹 프로젝트에 참여하게 되고 팀장을 맡게 되면서 결심한 것이 한 가지 있다. 일정관리를 잘 세우고, 잘 지키고, 잘 공유할 것. 특히 팀원들간의 일정이 잘 공유될 수 있도록 노력할 것! 부족하지만 그부분에 있어서 매번 회의때 마다 서로 나누고 있고.. 미흡한 점이 많지만 그래도 꽤 잘 되고 있다고 자평하고 싶다. 프로젝트 진행에 있어서도 처음 계획했던 바대로 일정이 어긋남 없이 잘 지켜지고 있어서 뿌듯하기도 하고 정말 다행이라는 생각이 많이 든다. 막상 내가 할 일은 끝, 최종 끝. 최종최종 끝까지 미루고는 있지만.. 이 부분만을 이제 신경쓰면서 마무리도 잘 지어보자! ☑️ 야금야금 매일 OS공부하기 • 목표를 크게 잡지 말고 매일 꾸준히 할 수 있을 정도로만 세울.. 공감수 1 댓글수 0 2023. 1. 8.
[새싹(SeSAC) 프론트엔드] 11주차 회고 [잘한 점] ☑️ 미리미리 해두기 한 번의 고생으로 미리 해둔 일들 덕분에 조금은 수월하게 보낼 수 있었던 한 주였다. 그리고 미리 해둔 일로 시간의 여유가 조금이나마 생기게 되면서 운동도 다시 시작하고 야금야금 독서도 다시 시작할 수 있었다. 또 괜스레 일을 벌이는 게 아닌가 싶기도 하지만.. 역시 독서와 운동은 꼭 계속해서 짊어지고 가고 싶다. 난 책 읽는 '내'가 좋고, 땀 뻘뻘 흘리면서 운동하는 재미를 아는 '내'가 좋으니깐. 더불어 오랜만에 흥미로운 책을 우연히 발견해서 너무 기뻤다. 뭔가 신박하면서 깔끔하고 재미있게 보고 싶은, 그런데 내게는 제목과 작가가 익숙하지 않은 작품을 보고 싶어서 도서관에서 책을 이리저리 둘러보다 우연히 골라든 책인데 생각보다 꽤 재미있어서 읽으면서 속으로 쾌재를 불.. 공감수 1 댓글수 1 2023. 1. 1.
[새싹(SeSAC) 프론트엔드] 10주차 회고 [잘한 점] ☑️ 빠르게 결정 내리기 결정을 내리는게 쉽지 않았는데 차분히 할일을 생각하고 우선순위를 내리는 것이 조금은 습관들었다. 하고 싶은게 아니라 해야되는 것을 하는 것을 계속해서 배워나가는 여정이지만 그 속에서 작은 발전을 이루어나가는 듯하여 나름 뿌듯했다. [이번 주 성장한 점] ☑️ 새로운 것을 바로 적용하기 배우는 것에 함몰되지 않고, 배우기 위해 배우지 않고. 사용하기 위해 배워나가야 하는 것을 전보다 많이 되새기게 됐다. 그래서 전이라면 다 배우지 못한 것에 후회하고, 다 배울 때까지 새로운 걸음을 내딛지 못했을텐데. 이제는 작은 용기를 내어 무엇이든 일단 만들어보자는 생각을 할 수 있게 되었다. 결국 내가 배우는 것은 무언갈 만들기 위한 것이니깐. 아니 개발 아니더라도 내가 알고 있는.. 공감수 0 댓글수 0 2022. 12. 26.
[새싹(SeSAC) 프론트엔드] day46 221219 📍깃 : 2005년 리누스 토르발스가 처음 소개 특징 ◼️ 버전관리 : 컴퓨터 파일의 변경사항을 추적 - 문서를 작성한 뒤 원본도 남겨주도 수정한 내용을 저장해야 하는 경우 파일이름은 유지하면서 문서를 수정할 때마다 언제 수정했는지, 어떤 깃이 변경되었는지 기록 가능 : 언제 수정했는지, 어떤 것을 변경했는지 편하고 구체적으로 기록하기 위한 버전관리 시스템 ◼️ 백업(backup) : 현재 내 컴퓨터에 있는 자료를 다른 곳에 복제 - 깃허브(Github) : 깃 파일을 위한 원격 저장소 또는 온라인 저장소 ◼️ 협업(Collaboration) - 여러 명의 사용자들 간에 해당 파일들의 작업을 조율하기 위한 분산 버전 관리 시스템 - 팀원들이 파일을 편하게 주고 받으면서 일할 수 있으며 누가 어느 부분을 .. 공감수 0 댓글수 0 2022. 12. 19.
[새싹(SeSAC) 프론트엔드] 9주차 회고 [노션 기록] [잘한 점] ☑️ 잘 쉬고 잘 충전했다. 한 주 내내 잘 쉬었고, 잘 충전했다. 정신없이 달리고 하고싶은 것들을 못할 때가 더 많았는데 하고 싶은만큼 하고 싶은걸 조금이나마 할 수 있었다. 그리고 쉼을 잘 즐겼다. 전에는 쉬어야할 때 잘 못 쉬었는데 이번에는 충분히 잘 쉬었다. [이번 주 성장한 점] ☑️ 새로운 배움을 시작하기 전에는 하나 끝내고 새로운 것을 배우는 것에 조금 부담감을 느꼈었는데 점점 배워둔 내용이 많아져있다보니 새로운 것을 배우는 것이 전보다 익숙해졌다. 하나의 언어를 제대로 해둔다면 새로운 언어를 배운다는 것이 처음 언어를 접하는 것보다 편하다는 말을 들은 적이 있다. 그래도 어쨌든 다른 언어일텐데 어떻게 그게 가능할지 가늠이 잘 되지 않았는데 최근 이게 무슨 의미인지.. 공감수 0 댓글수 0 2022. 12. 18.
[새싹(SeSAC) 프론트엔드] day44 221215 인터페이스를 사용하는 이유 ➡️ 타입이 객체인 '객체'를 생성할 때 코드마다 중복되는 객체 타입을 하나로 만들기 위해 타입별칭 인터페이스 코드마다 중복되는 타입을 하나로 만들어서 대입시켜주는 용도로 사용 - 코드의 재상용성 높임 작성중인 코드에 대한 더 많은 정보를 타입스크립트에 제공 자바스크립트 코드로 컴파일 되지 않음 객체에서만 사용 가능 📍 이름규칙 - 첫 글자는 대문자로 표기 - 인터페이스 이름 앞에 대문자 I 를 붙이지 않음 interface 인터페이스이름 { 속성이름 : 속성타입 } inferface Person { name : string, age : number } ➡️ 인터페이스는 객체에서만 사용할 수 있음 *실습 interface Language { name: string; level:.. 공감수 0 댓글수 0 2022. 12. 15.
[새싹(SeSAC) 프론트엔드] day43 221214 📍TypeScript : 타입이 있는 자바스크립트 - 타입을 명시하여 혹시 일어날 수 있는 문제점을 예방 function makePerson (name, age) {} makePerson("철수", "20") // 숫자가 문자 형태로 들어가서 연산이 제대로 되지 않음 function makePerson(name : string, age : number) {} makePerson("철수", "20") //error!! ◼️ 특징 ▪️ 변수 값에 데이터 타입 지정이 가능 - 예측 가능한 코드 작성 가능 - 디버깅 편리 ▪️ 객체지향 프로그래밍 가능 - ES6부터 사용가능한 클래스 기능을 제공 (TS가 ES6 다음에 나왔으므로) ▪️ 확장자가 .ts ➡️ 자바스크립트(.js)로 컴파일을 해줘야 함 $ npm .. 공감수 0 댓글수 0 2022. 12. 15.
[새싹(SeSAC) 프론트엔드] day41 221212 📍동기와 비동기 동기 (synchronous) 비동기(Asnychronous) 요청을 보낸 후 응답을 받아야 다음 동작을 실행할 수 있는 방식 ▪️ 특징 - 설계가 간단하고 직관적 - 요청에 대한 응답을 받을 때까지 대기해야하는 단점 요청을 보낸 후 응답을 바기 전에 다음 작업을 먼저 실행하는 방식 ▪️ 특징 - 동기 방식보다 복잡함 - 요청에 대한 응답을 받기까지의 대기 시간에 다른 작업을 할 수 있음 ex. fetch, useState 동기 방식은 서버에게 요청한 후 응답까지 다음 코드를 실행하지 못하고 기다림 비동기 방식은 서버에게 요청을 보낸 후, 자신의 할일을 계속 실행하고 있음 📍동기방식 const Sync = () => { console.log("1. 안녕하세요"); console.log(".. 공감수 0 댓글수 0 2022. 12. 12.
[새싹(SeSAC) 프론트엔드] 8주차 회고 [노션 기록] [잘한 점] ☑️확실하게 몰입하기 몰입이 필요할 땐 확실하게 집중하게 하는 힘이 새싹을 시작할 때보다 확실히 커졌다. 그만큼 할게 많고 급하긴 했지만 전엔 이러한 상황에서도 몰입이 잘 되지 않을때가 많았는데 요즘엔 잘 되는 느낌이다.. 특히 12월에 접어들면서 잔가지로 하는 일들이 다 끝나서인지 한가지에만 몰입할 수 있어서 집중해서 하고 결과를 만들어 낼 수 있었다. 확실히 무엇을 하든 한 번에 여러가지를 하려고 덤비는 것 보다는 확실한 하나를 끝마치는 것이 더 좋은 결과를 만들어내는 것 같다. 아니면 적어도 맺고 끊고를 확실하게 하든지 나만의 몰입요건이 조금은 생긴 느낌이고 그것이 충족될 때 확실하게 해낼 수 있다는 경험을 해낼 수 있어서 좋았다. ☑️많이 고민하고 할 수 있는 방법으로 .. 공감수 1 댓글수 0 2022. 12. 11.
[새싹(SeSAC) 프론트엔드] day39 221208 Hook는 리액트 v16.8에 새로 도입된 기능으로 항수형 컴포넌트에서도 상태 관리를 할 수 있는 useState, 렌더링 직후 작업을 설정하는 useEffect 등의 기능을 제공하여 기존의 함수형 컴포넌트에서 할 수 없었던 다양한 작업을 할 수 있게 해줌 useState : 함수형 컴포넌트에서도 가변적인 상태를 지닐 수 있게 해주는 hook * 일반 웹 사이트의 동작 과정 문제점 : 사용자가 원하는 모든 화면을 서버가 준비를 해준다면 서버에 많은 이용자가 몰린다면 서버가 힘들어짐 사용자입장에서는 서버가 힘들어지면 페이지 접속이 지연되는 경험을 겪을 수 있다 ➡️ 서버에 저장된 값을 화면에 반영하는 동적인 웹 문서 도구 개발 : 서버 사이드 렌더링(Sever Side Rendering) - ASP(Act.. 공감수 0 댓글수 1 2022. 12. 9.
[새싹(SeSAC) 프론트엔드] day38 221207 Context - 어플리케이션에서 전반적으로 사용할 값을 관리 ex) 사용자의 언어, 로그인 상태, UI 테마 등 환경 설정 Context와 컴포넌트가 연동되면 컴포넌트를 재사용하기 어려움 - 자주 변경되는 상태인 경우, 사용하지 않는 것이 좋음 : Context 내부의 값이 변경되면 Context를 사용하는 모든 자식 컴포넌드들이 리렌더링 됨 App이 가진 값이 G가 사용하고 싶다면 A ➡️ B ➡️ E를 거쳐와야함 (계속 자식 props로 전달) function App() { return ; } function GrandParent({ value }) { return ; } function Parent({ value }) { return ; } function Child({ value }) { ret.. 공감수 0 댓글수 0 2022. 12. 8.
[새싹(SeSAC) 프론트엔드] day37 221206 📍ueReducer() : 컴포넌트의 상태를 관리할 때 사용하는 Hooks const [state, dispatch] = useReducer(reducer, initialState); 값 설명 state 컴포넌트에서 사용할 상태 값 dispatch 액션을 발생시키는 함수 reducer reducer 함수 : 개발자가 직접 정의해야 하는 함수 initialState 초기 상태 값 dispatch( { type : value} ) // 액션이 생긴 모양이 객체 function reducer(state(현재 변수의 상태값), action(dispatch의 객체 = 업데이트를 할 정보)) { // 새로운 상태를 만드는 로직 return 새로운 상태; } - 특징 : 컴포넌트 상태 업데이트 로직을 컴포넌트에서 분.. 공감수 1 댓글수 1 2022. 12. 6.
[새싹(SeSAC) 프론트엔드] day36 221205 Hooks : 리액트 버전 16.8에 새로 도입된 기능 - 함수형 컴포넌트에서 상태 관리를 할 수 있는 기능 제공 ◼️ 종류 useState useEffect useRef useReducer useMemo useCallback 📍useState() const [state, setState] = useState(초기값); //예시 const [number, setNumber] = useState(3); // number =3 setNumber(6) // number = 6 - 가장 기본적인 Hook - 함수형 컴포넌트가 가변적인 상태를 지닐 수 있도록 해 줌 (*) 실습 1 - 숫자 증감 시키기 Counter.jsx import { useState } from 'react'; const Counter = .. 공감수 0 댓글수 1 2022. 12. 5.
[새싹(SeSAC) 프론트엔드] 7주차 회고 [노션 기록] [잘한 점] ☑️개념을 제대로 다지며 기초를 탄탄히 - 드디어 리액트를 새롭게 배우기 시작하면서 개념부터 찬찬히 제대로 다지고자 노력했다. 자동완성된다고 끝나는 것이 아니라 자동완성 되는 내용들이 어떤 것들인지, 내가 작성하는 코드만큼은 최대한 다 제대로 알고 넘어가고자 했다. 그 과정에서 강의를 듣는 것만으로는 한계가 있다고 생각하여 기본서를 보기 시작했다. 책으로 프로그래밍 공부하는 것에 좀 부정적이고 잘 되지 않는다고 여겼는데 막상 책을 보면서 공부하니 내가 원하는 부분을 바로 찾을 수 있어서 좋았다. 그리고 강사님께서 말씀해주신것처럼 정제되어 있는 정보를 담고 있는 결과물이기에 블로그나 기타 인터넷에 올라와 있는 정보보다 신뢰도가 높았고 표현또한 명확해서 좋았다. - 그리고 리액트의.. 공감수 1 댓글수 0 2022. 12. 4.
[새싹(SeSAC) 프론트엔드] day34 221201 📍 Post CSS - CSS module 기법 중 하나 : CSS를 불러와서 사용할 때 클래스 이름을 고유한 값 형태로 자동으로 만들어 컴포넌트 스타일 클래스 이름이 중첩되는 현상을 방지해주는 기술 파일이름_클래스이름_해시값 사용방법 - 버전 2이상부터는 별도의 설정이 필요없고, 다음과 같은 확장자로 파일을 저장하기만 하면 적용 파일이름.module.css CSS Module.jsx import React from "react"; import styles from "../CSSModule.module.css"; const CSSModule = () => { console.log(styles); console.log(styles.container); return ( CSS Module실습 ); CSSMo.. 공감수 1 댓글수 0 2022. 12. 1.
[새싹(SeSAC) 프론트엔드] day33 221130 스타일링 방식 설명 일반 css 컴포넌트를 스타일링하는 가장 기본적인 방식 Sass - 자주 사용되는 css전처리기 (pre-processor) 중 하나 - 확장된 css문법을 사용하여 css코드를 더욱 쉽게 작성할 수 있음 CSS Module - css 클래스가 다른 css클래스의 이름과 절대 충돌하지 않도록 파일마다 고유한 이름을 자동으로 생성해주는 옵션 styled-compontnts - 스타일을 자바스크립트 파일에 내장시키는 방식 - 스타일을 작성함과 동시에 해당 스타일이 적용된 컴포넌트 생성 가능 큰 프로젝트는 Sass를 많이 사용 이름 생성 규칙 컴포넌트_이름-클래스_이름 ex) .App-logo{ height : 40vmin; pointer-events : none; } .App-link {.. 공감수 0 댓글수 0 2022. 12. 1.
[새싹(SeSAC) 프론트엔드] day32 221129 📍이벤트 * 이벤트 사용 시 유의사항 - 카멜 표기법 : 이벤트 이름은 카멜 표기법으로 작성 - onClick, onKeyUp 등 - 이벤트의 값으로 함수 형태를 전달 : 실제 자바스크립트 코드를 전달하지 않음 - DOM 요소에만 이벤트를 설정할 수 있음 : div, button, input, form 등에만 이벤트 설정 가능 : 직접 만든 컴포넌트에는 이벤트 설정 불가능 이벤트 이름 이벤트 호출시험 JSX DOM 이벤트 프로퍼티 click 엘리먼트의 마우스나 키보드가 클릭될 때 onClick submit 폼의 데이터가 전송될 때 onSubmit mousemove 엘리먼트 위에서 마우스 커서가 움직일 때 onMouseMove mouseover 엘리먼트 영역 위로 마우스 커서가 돌아다닐 때 onMouseO.. 공감수 0 댓글수 0 2022. 11. 29.
[새싹(SeSAC) 프론트엔드] day31 221128 자바스크립트의 배열 - 다양한 자료형을 저장 가능 // 숫자형 const numberList = [1, 2, 3, 4, 5] //2개 이상의 자료형 const mixedList = [1, 'str', {}, function a() {} ]; XML과 JSX또한 저장 가능 // JSX 배열 const componentList = [, ... ] 📍state - 값을 저장하거나 변경할 수 있는 객체 - 컴포넌트 내부에서 바뀔 수 있는 값을 의미 - 주로 버튼 클릭과 같은 이벤트와 함께 사용 1. 함수형 컴포넌트의 useState 함수 2. 클래스형 컴포넌트의 state 속성 props state 부모 컴포넌트가 설정한 값을 전달받아 읽기 전용으로만 사용 가능 컴포넌트 내부에서 값을 직접 변경할 수 없음 값을.. 공감수 0 댓글수 0 2022. 11. 28.
[새싹(SeSAC) 프론트엔드] 6주차 회고 [노션 기록] [잘한 점] ☑️ 기록 남기기 - 프로젝트를 진행하면서 기록을 최대한 많이 남기고자 했다. 1. 깃허브 커밋 : 깃허브에 구현한 내용을 최소 1개라도 커밋하고자 했다. 그리고 커밋 메시지를 좀 더 자세하고 구체적으로 작성하기 위해 노력했다. 구현보다는 공부한 시간들이 더 길었기에 커밋수도 그만큼 많지 않았지만 하나하나 잘 남기려고 노력했다. 쓸데없이 혼자서 충돌도 내고 난리부르스를 쳤지만 그래도 하나씩 작은 결과물이 업로드되는 게 재미있었다. 2. 블로그 오류 기록 : 오류 기록을 찾아보고 그걸 블로그에 러프하게 기록했다. 사실 다시 안 돌아볼 수 있는 글일 수도 있지만.. 가끔씩 전에 프로젝트를 하면서 만났던 오류들을 기록했던 글을 보면 그때 이런 점을 몰랐구나가 남겨져 있어서 좋았다. .. 공감수 4 댓글수 0 2022. 11. 25.
[새싹(SeSAC) 프론트엔드] day30 221125 📍defaultProps : props 를 지정하지 않았을 때 기본적으로 사용할 값을 설정 app.jsx function App() { return ( ); } DefaultProps.jsx import React from "react"; const DefaultProps = (props) => { const { name } = props; return 안녕하세요 제 이름은 {name}입니다; }; // ** 컴포넌트이름.defaultProps DefaultProps.defaultProps = { name: "이름없음", }; export default DefaultProps; 📍props.children : 컴포넌트 태그 사이에 넣은 값을 조회할 때 사용 Wrapper.jsx import React f.. 공감수 0 댓글수 0 2022. 11. 25.
[새싹(SeSAC) 프론트엔드] day29 221124 📍React 란 : 페이스북이 만든 사용자 UI 구축을 위한 라이브러리 프레임워크 라이브러리 - 일정한 형태와 기능을 갖추고 있는 골격 또는 뼈대를 의미 - 개발 시 필수적인 기능을 제공 - 프레임워크가 정해준 방식을 따라 코딩을 해야함 (개발자의 자유도가 떨어짐) 특정 기능을 구현하기 위해 밀 만들어진 코드 또는 함수의 집합 angular, vue.js, spring, Django 등 React, JQuery, tensorflow, pandas 등 코드의 제어 흐름을 개발자가 조정할 수 없음 ex. 밀키트 코드의 제어 흐름을 개발자가 조정할 수 있음 ex. 마트에서 개발 재료 구매 ** 코드 주도권이 어디에 있느냐가 제일 큰 차이일 듯 - npm trends 📍특징 1. Component 기반 : 리액.. 공감수 0 댓글수 0 2022. 11. 24.
서울산업진흥원(sba) 청년취업사관학교 새싹(SeSAC) 마포 2기 기업 연계형 프론트엔드 실무 프로젝트 과정 수강 중간 후기 어느덧 새싹에 들어와 공부를 시작한 지 한 달이 넘었다. 이제는 습관처럼 평일 매일 9시에서 저녁 10시까지 교육장에서 머무르고 있으면서 무수히 고민을 하는 시간을 보내오고 있다. 수강을 시작한 지 한 달을 기점으로 첫 번째 프로젝트를 만들어보고 잠시 리프래쉬 하는 시간을 처음으로 가지게 되면서 새싹 자체에 대한 기록을 남기고 싶어서 글을 작성하게 됐다. 평소 공부하고 고민했던 것들은 수시로 계속 기록을 남기고 있지만 막상 하루 종일 머물고 있는 캠퍼스가 어떠한 곳인지, 내가 듣고 있는 수업과 과정을 이끌어주시는 강사님, 운영진분들에 대한 기록을 남기지 않았는데 이번에 좋은 기회가 되어 남겨보고자 한다. 청년취업사관학교 교육과정 - 교육과정 커리큘럼은 아래의 새싹 홈페이지 링크에서 자세하게 확인할 수 있.. 공감수 4 댓글수 2 2022. 11. 23.
[그밥집] 프로젝트 1차 완성안 기록 및 회고 -로그인 암호화 -open api자료에서 조건을 걸어 원하는 자료만 뽑아 mariadb에 저장(영업상태가 '영업'이며, 업장 주소지에 '마포구'가 들어가는 자료) - 위에서 걸렀던 db에 저장된 restraunt table자료를 바탕으로 쿼리문을 활용해 rcategory가 '한식'정보만을 불러와 front에 전달 -회원가입, 로그인창 구현 전체적인 디자인에 대한 충분한 고민을 하지 못해서 퀄리티가 너무 낮았따..... 여러모로 많이 아쉬웠다. - 지도에 마커 표시 마커 이미지도 위의 새싹 이미지도 바꿨었는데 .. 미처 제대로 옮기지 못해서 그냥 일반 마커로 마무리했다 뭐든 야금야금 기록해놨더니 다시 되돌아보는 소중한 자료들이 되어서 좋았다. [회고] 결과적으로 제대로 된 1차 마무리에 실패했다. 발표 후.. 공감수 1 댓글수 2 2022. 11. 23.
그밥집 오류기록들 - 1 도메인과 내가 실행한 도메인이 일치하지 않아서 app key가 맞음에도 kakao객체를 찾지 못해 api를 정상적으로 실행시키지 못하는 문제가 생겼다 -중복된 db connection으로 값이 안 들어갔음 https://jhleed.tistory.com/104 [Node] 트러블 슈팅 : MySql Connection Error 현상 MySql을 사용해서 DB를 조회해오는 함수를 작성하였는데 간헐적으로 아래와 같은 에러가 발생하였다. Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client 정확하게는 첫 번째 요 jhleed.tistory.com var sql = "insert into bobjip (user, .. 공감수 1 댓글수 0 2022. 11. 21.
[새싹(SeSAC) 프론트엔드] 5주차 회고 [노션 기록] [잘한 점] ☑️ 기초를 바탕으로 계속 생각하기 - 내가 사용하고 있는 것을 탄탄하게 알기 위해 계속해서 기초를 생각하면서 공부했다. - api 가져와보는 시간을 많이 가지면서 내가 배웠던 js개념을 바탕으로 이건 콜백 함수고, 이건 객체 형태여서 이렇게 쓰는 것이고 등등의 생각을 계속해보기 위해 노력했다. - fetch를 배우고 ajax를 다시 사용해보면서 내가 얼마나 기초가 부족했는지 다시금 느낄 수 있었다. - 배웠던 내용을 기반으로 찬찬히 코드를 하나씩 보다보면서 전보다 더 이해도를 높게 가지고 코드를 수정하고 응용해 나갈 수 있었다. ☑️ 공부한 내용 기록해두고 틈틈이 꺼내보기 - 기록해둔 것들이 많아지고, 새롭게 배운 내용들이 많아지면서 이걸 유용하게 사용할 기회를 많이 얻게 됐.. 공감수 1 댓글수 0 2022. 11. 18.
[새싹(SeSAC) 프론트엔드] day22 221115 API (Application Programming Interface) : 응용 프로그램에서 데이터를 주고 받기 위한 방법 - API 사용 시, 개발 시간 및 비용 절감 가능 Open API : 누구나 사용할 수 있도록 공개된 API - 지도, 날씨, 음악, 공공데이터, 쇼핑 등 다양한 분야에서 사용 가능 - 제공처 : 네이버, 구글, 카카오 URL에 넣는 주소 ➡️ 현재 위도, 경도 값을 주면 그것에 맞는 날씨를 알려주는 방식 1.도시 이름 (by city name) 2. 도시 아이디(by city ID) 3. 도시 위치(by geographic coordinates) 4. zip code (by zip code) latitude : 위도 longitude :경도 API Key : 사용자의 API키 n.. 공감수 1 댓글수 0 2022. 11. 16.
[새싹(SeSAC) 프론트엔드] day21 221114 JQuery : 웹사이트에서 자바스크립트를 쉽게 활용할 수 있도록 도와주는 오픈 소스 기반의 자바스크립트 라이브러리 - 웹 페이지 상에서 엘리먼트(Element)를 쉽게 찾고 제어 - 웹 브라우저 호환성이 뛰어남 - 애니메이션과 같은 다양한 기능 제공 www.jquery.com jQuery What is jQuery? jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a m.. 공감수 1 댓글수 0 2022. 11. 14.
[새싹(SeSAC) 프론트엔드] 4주차 회고 [노션 기록] [잘한점] ☑️ 많이 만들어보기 정말 .. 최대한 많이 만들어봤다. 디자인부터 시작해서 여러가지 기능구현을 해봤는데 수업에서 배운 내용을 바탕으로 만들어가다보니 굳이 검색해서 해당 기능을 찾아야되는 번거로움과 시간낭비가 줄어들어서 좋았다. 새삼스럽게 기초의 중요성을 다시금 느낄 수 있었다. 결과물은 다 만들고 보니 정말 너무 간단간단했다.왜이리 간단한걸 오래했나 싶기도 해 아쉬운 마음이 어쩔 수 없이 들긴 했다. 그래도 내가 목표했던 바와 같이 만들어 내니 소소한 성취감을 얻을 수 있어서 힘들지만 뿌듯했다. 간만에 다시 몰입해서 무언갈 만들어내는 경험을 할 수 있어서 좋았다. https://bluepinetree.tistory.com/381 실습문제 응용해서 만들기 실습과제로 주어진 간단한.. 공감수 2 댓글수 0 2022. 11. 11.

문의안내

티스토리
로그인
고객센터

티스토리는 카카오에서 사랑을 담아 만듭니다.