본문 바로가기

전체 글

 (72)
[React] react에서 이미지 엑박이 뜰 때 img태그를 이용해서 로고 이미지를 삽입하려는데 이상하게 자꾸 깨진 파일로 표현되었다.처음에는 경로를 잘못 지정했나 하고 이리저리 바꾸어보았지만 전혀 소용이 없었고, 결국 상대경로를 뭔가 실수하고 있나 싶어 절대경로로 지정해보았지만 이 마저도 실패.뭔가 이상해 여기저기 검색해보며 시도해봤다.'png파일을 인식하지 못한다 => jpg로 변경', '상/하위 폴더안에 넣어서 해야한다 => x', '이미지 파일에 문제 => 다른 이미지로 교체' 등등 온갖 방법을 시도하다, 문득 react를 초기에 실행하고 불필요한 파일을 삭제할 때 있었던 import logo ... 이 생각났다.찾아보니 react에서 img파일을 사용하기 위해선 import문을 사용하면 된다고 한다. import img from "경로";....
간단한 게시판 만들기 - 6 기본적으로 구현하고자 했던 게시판의 기능들은 만들었으니 이제 남은 기능인 로그인, 회원가입 등을 db에 연동하는 과정을 기록하려 한다. 일단 두 작업을 만들기 전에 회원 정보를 저장해 둘 db를 만든다. CREATE TABLE userinfo( name VARCHAR(20) NOT NULL, id VARCHAR(50) NOT NULL, pw VARCHAR(50) NOT NULL, PRIMARY KEY(name) ); 만들어놓은 table에 전송받은 데이터를 저장할 쿼리문을 만든다. app.get("/user/userget", (req, res)=>{ const query = "SELECT * FROM userinfo;"; db.query(query, (err, result)=>{ res.send(resu..
간단한 게시판 만들기 - 5 기본적인 서버 환경 세팅을 마쳤으니 이제 db를 연결해 볼 것이다. 이전에 이미 한번 정리했지만 작업 도중에도 계속 혼란스러웠기에 대략적으로 서버 구분을 하자면, 지금 만드는 server 폴더의 index파일은 8000번 포트에서 동작하며 db와의 연결을 통해 데이터를 읽거나 삽입하는 등의 역할을 한다. 또한 클라이언트(브라우저)로부터 간접적으로 데이터를 요청받고 결과를 전달해주는 중간 매개체와도 같은 역할을 한다. 그리고 이전에 만든 client 폴더의 파일들은 3000번 포트에서 동작하며 클라이언트로부터 직접적으로 요청을 받고 이전에 정리한 웹서버의 역할대로 정적인 컨텐츠를 제공한다. 또한 db와 관련된 데이터는 server/index.js로 전달하여 처리한다. (나름대로 정리하였으나 틀린 부분이 있..

티스토리툴바