SSO의 개발공부 블로그

[노마드 코더] ReactJS로 영화 웹 서비스 만들기 #3 * 변수를 JSX 에 전달하는 방법 = 변수를 선언하고, 중괄호에 담는다. * 컴포넌트 리렌더링 방식 2가지 첫번째 방식 >> 1. container를 한번 렌더링하기만 하고, 리렌더링이 되지않아 UI는 업데이트 되지 않는 코드 2. countUp 라인이 호출되면 counter가 1 증가하고, 그 뒤에 Container 를 리렌더링 해주면 UI도 업데이트되는 코드 - 위 2번 코드와 동작이 동일한 render 함수를 만든 버전 결론 => 위 방법은 데이터를 바꿀 때마다 다시 렌더링하는 것을 잊으면 안되므로 최고의 방식은 아니다. 버튼을 클릭하여 증가하는 counter 값을 render 함수를 다시 호출하지 않고, 자동으로 리렌더링하려면 어떻게 ..

[노마드 코더] ReactJS로 영화 웹 서비스 만들기 #1 - React JS 는 페이스북에 의해 만들어 졌고, 아직도 사용 중 - 최근엔 인스타그램, 핀터레스트, 넷플릭스 등 큰 사이트들도 React JS 를 사용함 [노마드코더] ReactJS로 영화 웹 서비스 만들기 #2 1. 위 코드 실행 시에는 그냥 흰 백지화면으로 elements 확인 시 body 안은 당연히 비어있고, console에 span을 치면 span은 생성되었지만 페이지에는 올라오지 않은 것을 확인 가능함 2. body 안에 React element 를 가져다 두는 방법 : React JS 가 HTML 생성하게 하려면 react-dom 이 필요함. - React JS 는 어플리케이션이 아주 interactive하게 만들어주는 lib..

이 링크를 참고하여 미리 만들어둔 React JS 폴더 안에 react 파일을 생성하고 해당 파일 실행 완료 1. VScode 실행 상태에서 '파일 > 열기' 경로를 통해 프로젝트 만들 폴더 선택 2. 터미널에 'npx create-react-app 프로젝트명' 명령어 작성 3. 해당 프로젝트 파일의 정상생성 확인 후 'cd 프로젝트명' 을 통해 해당 프로젝트 경로로 이동 4. 'npm run start' or 'npm start' 명령어 통해 localhost 서버 스타트

* 참고 블로그 우분투(ubunto) GitHub 연동 및 업로드 (velog.io) 우분투(ubunto) GitHub 연동 및 업로드 우분투(ubunto) 에 GitHub 연동 및 폴더 올리기 velog.io pull 문제로 다시 클론할 일이 생김 => 다시 icampdoit 폴더를 삭제하고 클론하며, 기존에 업로드된 사진들이 같이 삭제되면서 사이트에는 사진표시가 안됨 => 폴더 삭제 전에 git push를 해줘야 함 * 사진 백업하기 (Git Push) - 상태 확인하기 위한 코드 git status - 아래와 같이 빨간색으로 드면 git에는 적용안되고, 내 작업환경에서만 적용된 것 - 아래 코드를 입력하면 위의 빨간색 파일들이 다 commit 할 수 있도록 추가된다. git add . git sta..

도메인 등록 아래 사이트에서 무료로 도메인 등록함 https://xn--220b31d95hq8o.xn--3e0b707e/ 내도메인.한국 - 한글 무료 도메인 등록센터 한글 무료 도메인 내도메인.한국, 웹포워딩, DNS 등 무료 도메인 기능 제공 xn--220b31d95hq8o.xn--3e0b707e AWS 호스팅 레코드 생성​ 아래 두 링크를 참고하면 됨. 첫번째 링크에선 80으로 바꾸는거 그거 안함 도메인 연결하기 AWS EC2 도메인 연결 (tistory.com) AWS EC2 도메인 연결 1. AWS EC2 Route 53 이동 https://us-east-1.console.aws.amazon.com/route53/v2/home#Dashboard 2. "호스팅 영역" 선택 > "호스팅 영역 생성" ..

작업 환경 Eclipse Maven Project Spring Boot (Controller + JSP) Java Javascript Html / CSS BootStrap5 jQuery MariaDB AWS EC2 인스턴스 생성 지역은 서울로 함. t2.micro 로 (ubuntu) 인스턴스 생성해줌. 이때 보안키도 새로 생성해줌. (원래 있으면 그거 쓰는데 난 없어서 새로 생성함. (awsSeoul) 보안그룹으로 들어와서 default 말고 인스턴스 생성하며 생성된 다른 보안그룹(launch-wizard-1) 을 선택한 후 인바운드 규칙을 추가해 준다. 인바운드 규칙은 2가지 추가해줬다. 하나는 apache-tomcat(포트 8080), 하나는 mariadb 용(포트 3306). putty 실행​ pu..

먼저, 체크박스 전체 선택 해제 전체 선택 해제(=초기화 버튼)의 id는 allNonChk input 체크박스의 type은 전부 checkbox 전체 타입에 관해서는 id처럼 # 이 아닌 : 로 해줘야 한다는 것을 알게 되었다 !!! 다음으로 modal 버튼의 위치 위처럼 버튼이 세 개 일때도 두 개 일 때도 전부 class 에 justify-content-between 을 추가해주면 된다. (ml-auto / mr-auto / style="float:left" 이런거 다 안됨..) 참고한 사이트 >> Left & right align modal footer buttons in Bootstrap 4 - Stack Overflow Left & right align modal footer buttons in..

아래는 발표준비 & 발표대본 1. 텍스트에디터에 이미지파일첨부시 이미지가 에디터에 안뜸 summernote onimageupload summernote에서 제공하는 callback함수를 다시 분석해서 다시 코드를 짰다.. => 해결 base64로 저장되면 엄청 길게 나와서 db 저장 -> db무리-> summernote onimageupload 라는 함수를 사용하여 파일명/파일사이즈만 따로 추출 -> db저장하는 방식으로 변경 (저장할때 파일명 중복방지를 위해 따로 검사코드) String savename = image.getOriginalFilename(); => 오리지널 파일명 저장 2. base64 -> 파일명으로 저장 리나언니 카톡참고 summernote는 base64로 인코딩 후 저장하는 방식이여..

localhost:8080/mboardlist.do?subjectValue=3 => 말머리선택에 따라 말머리값(subjectvalue)을 갖고 다니면서 페이지 이동

아 뿌 듯 해 해냈다 searchKeyDAO >> - 파싱문 다 지우고, 쿼리문으로 싹 바꿔주었다. select facltNm, addr1, addr2, induty, firstImageUrl, contentId from go_api where facltNm like "%서울%" or addr1 like "%서울%" or induty like "%서울%"; - 이런 코드가 필요했고, 성공했다. String sql = "select facltNm, addr1, addr2, induty, firstImageUrl, contentId from go_api where facltNm like ? or addr1 like ? or induty like ?"; ArrayList datas = (ArrayList)jd..