tonawood3721

제 윈도우에선 alt + 좌/우 화살표 키 누르면 편집창에서 이동됩니다.

파일 이동을  윈도우에서 사용법도 알고 싶습니다

vscode에서 새 파일 탭 생성한 상태(탭 제목 'Untitled-1')이거나 타입스크립트 파일로 인식할때 저렇게 html 태그에 빨간줄 가는것 같더라고요.ctrl + s 눌러서 xxx.js 파일로 저장하면 붉은 줄 없어지더군요.

태그에 빨간 줄이 쳐지는 이유

제 생각엔 아래와 같으니 그냥 참고만 바랍니다.<테스트 해본 코드><pre class="hljs"><code class="language-html">html
<div class="fbox">
 <div class="item1">1</div>
 <div class="item2">2</div>
</div>

css
.fbox {
 /* display: flex; */
 flex-direction: row;
 justify-content: center;
 align-items: center;
}</code></pre>&nbsp;<ol><li>'display: flex의 기능은 무엇인가요?'=> (답변) 해당 DOM 엘리먼트(<div class="fbox">)를 Flex container로 만들어줌. 즉, 해당 엘리먼트에 flex 관련 property를 적용할수 있게 해줌. 다시말해flex-direction : row; 같은 것들이 정상 적용되게 해줌</li></ol><ol start="2"><li>'flex-direction : column ; 만 실행된 것과 같은 효과가 나타났습니다.' 에 대한 제 판단.=> flex: row/column; 없이 flex-direction: row; 같은 flex 속성들을 사용한거라서, 브라우저에서 html/css 해석/실행시 해당 속성들을 무시했기 때문인것 같습니다.그래서 'flex-direction: column만 실행된것 같은 효과'라기보단, Div 의 원래 속성이 Block 엘리먼트이기 때문에 위에서 아래로 줄바꿈되어 쌓인것으로 판단됩니다.그렇게 판단한 이유는 아래와 같이 유효하지 않은 css 속성을 입력해도, 유효하지 않기 때문에 무시하고 에러 없이 그냥 div의 본연의 속성대로 브라우저에 그려지는것 같아서 입니다.<pre class="hljs"><code class="language-css">.fbox { hoho: center; }</code></pre></li></ol>

display: flex 의 기능은 무엇인가요?

우측 사이드바 탭 중에서 export 가 선택되서 그런거 같은데요. 옆에 properties 탭 눌러 보시겠어요?

피그마 CSS 속성이 안보여요

제가 코치/멘토님이 아니니 멘토님이 답변 다시기 전까진 참고만 하시면 될거 같습니다.제 생각엔 입력이 되게 만들라고 내준 과제 같습니다. 해당 html, css 과제는 여태 배운거를 활용하는 거고, 다음 진도에 기본적으로 필요한 내용이라고 판단되네요.&nbsp;아이디나 비번 입력해야 하는 곳에 모양만 디자인만 똑같이 만들고 마우스 커서랑 키보드 입력이 안되면 수업 내용 따라가시는게 큰 의미가 없을거 같아서요. 퍼블리셔나 개발자 되시려고 이 강의 들이시는 거면 입력이 되게 구현하셔야 할 거 같습니다.아이디나 비번 입력 하게 하는거 기본 태그는 <input text="text'> , <input type="password"> 이런 태그들이고, css들도 기본적인 수업에서 다룬거라서 노션 보시거나 동영상 보시면 대략 비슷하게 만드실수 있을거에요.지역 선택은 select 태그 수업 내용이나 수업 코드 참고하시고, 성별 선택은 <input type="radio"> 내용 참고하시면 될거 같습니다.너무 막막하시면 노션 페이지나 동영상을 다시 보면서 복습하시면서, 강의 내용의 html, css를 의미를 생각하시면서 코드를 직접 따라 치시면, 회원가입 과제 구현하는데 도움이 될 거 같습니다. 부담되시면은, 제 생각엔, 기능은 구현하되, 디자인은 100% 똑같이 만들지 않아도 되지 않을까 싶습니다.

회원가입과제

방법은 여러가지 있겠지만, margin-right 같은 css 속성 이용하시면 되네요. <pre class="hljs"><code class="language-css">.fa-solid.fa-star {
 margin-right: 30px;
}</code></pre>

아이콘과 글자 사이 간격

home.html 파일이 잘못된 경로인 cyworl/styles 밑에 있네요. html 파일을 cyworld 밑에 놔두고 하시면 될 거 같네요.

html에 iframe으로 연결했는데 안떠요..

강사님~,&nbsp; 방금 12월 28일 올린 소스라고 되있는거 보고&nbsp; 아래 처럼 수정하여 AWS에 리액트 뜨는건 확인했습니다.&nbsp;
하지만 아래와 같은 500 에러가 나네요. 플라스크나 디비가 제대로 네트워크가 연결이 안됐든 설치가 안됐든 했나봅니다. 시간될때 더 확인해보고 댓글이나 게시글 남기겠습니다. 혹시 힌트 있으시면 주셔도 매우 감사할거 같습니다.
<pre class="language-html"><code>POST http://dockermultiapp-env.eba-qurqfhda.ap-northeast-2.elasticbeanstalk.com/api/value 500 (Internal Server Error)

createError.js:16 Uncaught (in promise) Error: Request failed with status code 500
 at e.exports (createError.js:16)
 at e.exports (settle.js:17)
 at XMLHttpRequest.p.onreadystatechange (xhr.js:61)</code></pre>
&nbsp;
< 리액트 => AWS 배포 성공 변경점 > - 플라스크 배포/네트웍연결이랑 AWS RDS 설정은 저의 확인이 더 필요함.
frontend/Dockerfile.dev 랑 frontend/Dockerfile를 아래 처럼 수정하였습니다.
(변경 전)FROM node:alpine as builder&nbsp; => (변경 후) FROM node:16-alpine as builder
&nbsp;
그리고 추가로 frontend/package.json 을 로컬 개발 환경에서 빌드인가 실행시
&nbsp;permission 에러나서&nbsp;
--openssl-legacy-provider 넣었습니다. 이거 다시 없앴습니다.
개발 버전에서는 아직&nbsp; 테스트 못해봤는데 또 permission 에러나면&nbsp; "start": "react-scripts --openssl-legacy-provider start",&nbsp; 이부분 다시 넣어야 할거 같습니다.

질문1. AWS 배포시 에러 "Environment health has transitioned from Info to Degraded.

안녕하세요 좋은 정보 공유 감사합니다.
근데 저도 동일한 에러 나서&nbsp;/nginx/Dockerfile에 expose 80 적용했는데 해결이 안되네요.
<pre style="box-sizing: border-box; margin-top: 0px; margin-bottom: 16px; padding: 16px; -webkit-font-smoothing: auto; font-family: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace; background-color: #f6f8fa; color: #454545; font-size: 13.6px; overflow: auto; overflow-wrap: normal; line-height: 1.45; border-radius: 3px;"> FROM nginx
EXPOSE 80
COPY ./default.conf /etc/nginx/conf.d/default.conf</pre>
&nbsp;
혹시 아래의 내용 해결책에대해 아신다면 조금의 도움주시면 매우 감사하겠습니다.
&nbsp;
질문1. AWS 배포시 에러 "Environment health has transitioned from Info to Degraded. Command failed on all instances. Incorrect application version found on all instances. Expected version "Sample Application" (deployment 3)" 가 뜨면서 배포 실패가 나네요. 강사님 이 에러 해결책좀 아시면 알려주시면 매우 감사하겠습니다
<span class="info-cover profile-cover" style="box-sizing: inherit; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; color: #858a8d; font-family: 'Noto Sans KR', -apple-system, 'system-ui', BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', Helvetica; background-color: #ffffff;">Johny Kim님의(20<span class="info-cover date-cover" style="box-sizing: inherit; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; color: #858a8d; font-family: 'Noto Sans KR', -apple-system, 'system-ui', BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', Helvetica; background-color: #ffffff;">21.12.21 AM 01:59)글"<span style="color: #212529; font-family: 'Noto Sans KR', -apple-system, 'system-ui', BlinkMacSystemFont, 'Apple SD Gothic Neo', 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', Helvetica; font-size: 18px; background-color: #ffffff;">AWS EB: During an aborted... 빌드 에러 뜨시는 분들" 의 해결책인
<pre style="box-sizing: border-box; margin-top: 0px; margin-bottom: 16px; padding: 16px; -webkit-font-smoothing: auto; font-family: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace; background-color: #f6f8fa; color: #454545; font-size: 13.6px; overflow: auto; overflow-wrap: normal; line-height: 1.45; border-radius: 3px;"> nginx dockerfile 에 EXPOSE 80 추가하니까 되네요.</pre>
라는 글은 보고 이미 적용해본 상태인데 제일 위의 에러가 나네요. 깃헙에 올라온거 그대로 하면 몇몇 에러가 있어서 수정하여 적용한 버전의 제 깃헙 퍼블릭 주소입니다.
https://github.com/Clark19/docker-multi-app
&nbsp;
질문2. 책의 9장 실습시 Travis CI에서 총 3개의 이미지가 도커허브에 빌드되어 올라가야하는데, 도 커허브에 이상하게 frontend 이미지만 제 레지스트리에 업로드 안되있네요 travis ci화면엔 테스트 에러와, 빌드 에러, push 에러 표시가 없는거 같은데 말입니다
이유를 알수있을런지요
https://hub.docker.com/&nbsp; 에서 제 아이디(레포?)는 clarkgable1입니다.
이건 도커 허브에 프론트 이미지가 하나 업로드 안된건 질문1의 aws 배포 에러와는 직접 상관없는데요. 이유는 도커허브 이미지 다운받는 방식이 아닌 이전 실습에서도&nbsp; 이미 aws 배포는 동일하게 실패했었기 때문입니다.
&nbsp;
몇 주전에 '도커와 CI 환경'이라는 책 사고 어제 다보면서 실습하는데 도커리액트 싱글앱도 그렇고 8,9장의 도커 멀티컨테이너 앱도 aws 배포시 1번의 문제가 발생하여 애를 먹고 있습니다. 그래서 도움을 혹시 얻을수 잇을까해서 인프런에 동영상까지 중복으로 구매하였네요. 도움주시면 매우 감사하겠습니다.

tonawood3721

Posts