kasumil의 코딩 공작소

오늘 해야할 것. 1) 로그인 컴포넌트(컴포넌트가 교체되면서 새로 출력하는 부분 만들 것) - 완료 2) 상세페이지 사진 hover시에만 떠야하는데 안떠서 스타일 컴포넌트로 통일 -예정 3) 상세페이지 호텔 설명 slice함수를 통해서 배열로 만들고 이를 map함수를 통해 출력하기 = 예정 4) 상세페이지 이미지(slick slider) 구현 - 예정 로그인 컴포넌트를 고쳤다. 우오오~(Modalhandler 구조는 아직도 이해가 안됨;;; 리덕스 같은데, 리덕스는 아니라고 하는데 함수를 조금더 공부해봐야 할듯 싶다.) 모든 로그인 컴포넌트를 컨트롤하는건 nav 컴포넌트였던 것이다. 이것이 꺼지도록 애초에 nav에서 설정한다면, 그것을 props로 하위 컴포넌트로 보내버리면 되는 것이었다. import ..

- 오늘한 일. hotel 상세페이지 이동. react redux에 세션을 통해서 배움. 이력서 세션이 있었음. 오늘의 문제점... 화면 마우스 이벤트로 hover시에 숨겨져야 하는 빨간색 동그라미친 부분이 hide, exhibit 클래스가 제대로 안 먹는 문제가 발생. 컴포넌트 클래스로 죄다 통일하여 정리해야겠다. 수정 예정: 충돌 문제를 해결하기 위해서 스타일 컴포넌트로 리팩토링하여 싹 다 통일 예정. 예상외로 내 속도가 너무 느려서 난항 중. 버튼을 누르면 이동하는 슬릭을 넣을 예정. 아래 코드 블럭은 사진을 표현하는 컴포넌트. import React, { useState } from "react"; import styled from "styled-components"; import { withRo..

- 오늘의 해야할 것. 코딩....코딩...코딩....은 농담같지만 진실인것이고~! ༼ つ ◕_◕ ༽つ 엊그제 해결했다고 생각한 것이 폭탄이 되어 돌아온 Login...엄청나게 많은 코드수정을 요구 받음.... 어제 해결해야했으나 주말만 되면 몸이 아프네~(*￣ρ￣) 그래서 오늘 해결하고 있습니다. 오늘 이거 로그인 끝내고, 오늘마저 hotelpage에서 평점을 이미지로 등급을 리턴하는 방식을 구현하려고 노력중입니다. 내용은 간단하지만 실제로 구성하기가 어려워서 어찌해야할지.... import React, { useState, useEffect } from "react"; import styled from "styled-components"; import { withRouter } from "react-..

- 오늘의 한 것. 이전에 작성한 socialLogin, emailLogin, signup 컴포넌트에 대한 리뷰받은 것을 수정하여 재업로드. 어제 만들다만 1개 상세 페이지기존에 작성하다가만 styled-component를 마저 작성하기로 함. 아래 코드는 호텔페이지 1개의 헤더(header)부분 import React, { useState } from "react"; import styled from "styled-components"; import { Link, withRouter } from "react-router-dom"; import { IoMdPin } from "react-icons/io"; import { IoMdHeartEmpty } from "react-icons/io"; import..

이번주 월요일에 적어야할 내용을 목요일에 적고 있다. ꒰( ˵¯͒ꇴ¯͒˵ )꒱ 우리가 해야할 사이트는 tripadvisor로 선정되었고, 모두가 경악하였다. 〣(ºΔº)〣 1차 프로젝트보다 훨씬 어려운 사이트를 선정되었기때문이다. ٩(͡◕_͡◕ 여기저기 이전 1차에 비해서 많이 어려워진 스크롤이벤트, 여러 기능들이 많아졌기에 그러하다. youtu.be/NDQAJ3PJ2kU 트립어드바이저 본홈페이지 해당 기능을 설명하기 위한 유튜브 링크 이중에서 내가 구현해야할 기능은 로그인, 회원가입을 맡았다. 원래는 다른것을 해야하지만, 이전 1차에서 구현하지 못한 모달을 위해서 그냥 받아들였다. 그리고 최대한 빨리 다른 페이지를 할것이다. ◝(⁰▿⁰)◜ 하는 마음으로 프로젝트를 시작했다. 의외로 난항이었던 것이 구글..

youtu.be/tCugSJzPjZY 팀명 : ok-bujangnim 구성원 : 프론트 엔드 3명, 백엔드 2명. 프론트엔드 3명 최운정(PM), 배정규, 송수호 백엔드 2명 최홍일, 이문영 프로젝트 gihub: github.com/kasumil/10-ok-bujangnim-frontend kasumil/10-ok-bujangnim-frontend Aesop 사이트 클론 위코드 10기 팀프로젝트. Contribute to kasumil/10-ok-bujangnim-frontend development by creating an account on GitHub. github.com 나의 소개 나의 이름은 송수호입니다. 부트캠프인 위코드의 시작일인 2020년 6월 22일이 제 개발 경력의 시작이자. 개발자로..

import React, { Component } from "react"; import { withRouter } from "react-router-dom"; import "./Login.scss"; class Login extends Component { constructor(props) { super(props); this.state = { email: "", pw: "", }; } hadleValueID = (e) => { this.setState({ email: e.target.value, }); }; hadleValuePW = (e) => { this.setState({ pw: e.target.value, }); }; // 로그인용 버튼 hadleBtn = (e) => { fetch("http:..

- 오늘의 과제 * 실제 data.json 받아서 연결해보기 * filternav 호출해서 연결하기 오늘의 실습. 해당 컴포넌트에서 Productlist를 호출하려고 하는데, 렌더 오류가 나왔다. import React, { Component } from "react"; import Nav from "../../Components/Nav/Nav"; import Productfilternav from "../../Components/Productfilternav"; import Mapcomponent from "./Component/Mapcomponent"; import Footer from "../../Components/Footer/Footer"; import "./Maplist.scss"; class..

오늘의 과제 - mapgoods 컴포넌트의 list 아이템중에 한개만 선택하는 것을 설정하기. 지금 문제점은 여러개가 같이 동시에 onMouse 이벤트가 작동한다. import React, { Component } from "react"; import { Link } from 'react-router-dom'; import "./Mapgoods.scss"; // const obj = { // 0: // } class Mapgoods extends Component { constructor() { super(); this.state = { products : [], btnChange: true, display: null, } this.hoverOverChange = this.hoverOverChange.b..

어제부터 고민하던 내용인 className 동시 적용여부였다. html에서 class를 단순히 뛰어쓰기만 하여 두가지를 동시 적용하는 것을 사용했지만, 까먹고 있었던 것이다. 그렇기에 나는 class를 한개는 동적으로 다른 한개는 정적으로 유지해야하니 더욱 더 고민했었다. 멘토님한테도 이 문제를 3번이나 물어봤지만, 나의 사항에는 적용할 수 없었다. 이때 문제 점으로 문제는 3항 연산자에도 해당 내용이 적용되는가였다. why? 한개로 class를 통일하면 서로 적용해야할 class내용이 달라서였고, 2개로 넣자니 3항연산자가 들어가는 부분에 방해가 되는 것이다. 결국 내가 원하는 답을 알려주신 멘토님이 있었다. 단순히 뛰어쓰기해서 적용해보라고 말씀하셨다. 해당 결과물이다. 단순히 보면 간단한 내용이지만,..