티스토리

Illie

검색하기

블로그 홈

Illie

sungilryuu.tistory.com/m

(*ᴗ͈ˬᴗ͈)ꕤ*.ﾟ 님의 블로그입니다.

구독자: 20

방명록 방문하기

주요 글 목록

[방통대] UNIX 시스템 - 맥북으로 록키 리눅스 (Rocky Linux) 설치하기 서론수업에 사용하는 리눅스는 Rocky Linux 윈도우 기준으로 수업이 진행되어맥북유저들을 위한 Rocky 리눅스 설치 과정을 나누고자 글을 쓰게 되었다 리눅스 환경 세팅 때문에 공부에 방해되지 않았으면 하고 시간을 아꼈으면 한다! 본론처음 배우는 입장이고 아직 잘 모르니까 최대한 간편하고 리스크가 적은 방향으로 설치를 진행하였다 (파티션 나누는 방식이 아닌, 가상머신을 설치하는 방법으로 진행 예정)1. 프로그램 설치우선 설치해야 할 프로그렘이 두 개 있다. 1. 가상머신 소프트웨어 - UTMhttps://mac.getutm.app/ 인터넷에서 바로 설치한다면 무료, 앱스토어에서 설치하게 되면 유료이다왼쪽버튼을 클릭해주자 2. 로키 리눅스 - DVD ISO 설치https://rockylinux.org/.. 공감수 0 댓글수 0 2024. 9. 11.
방통대 편입 후기 (컴퓨터과학과) 서론개발 쪽에 일하는 비전공자들은 한 번쯤 방통대를 고민하게 된다 - 방통대에서 전공자에 걸맞는 양질의 정보를 얻을 수 있을까- 일과 병행한다고 일도 놓치고 학업도 놓치는 가장 최악의 상태에 놓이게 되진 않을까- 컴퓨터 관련 정보를 습득하는 방안이 아주 다양한데, (인프런, 유데미, MOOK, 그 외 다수)그 방안을 모두 제쳐둘만큼 방통대라는 옵션이 매력적일까- 다른 사이버 대학도 많은데 꼭 방통대여야만 할까 뭐 이런 고민들을 하면서 하루에도 몇 번씩 고민했다 본론방통대에 입학하기로 마음을 다잡게 된 계기는내가 컴퓨터 지식에 대한 편식을 하게 될 거 같다는 작은 생각에서 부터다. 아무리 내가 망라한 지식 속에서 내게 맞는 적절한 것을 취한다 하더리도,어쩔 수 없이 취향이나 그 시점의 관심분야에 초점이 맞.. 공감수 0 댓글수 0 2024. 6. 29.
[MAC] npm global로 설치 안될 때 개요 아... 맥북을 산지 어언 1년 반... 맥북에서는 척척척 다 되는거 같아보여도 사실 이런저런 이슈가 있다 예를 들어 m1 air 터미널에서 code . 하면 visual code가 안켜진다던가... 경로를 python 을 python3으로 바꿔줬던거 같은데 역시 기록을 안하니까 기억이 안난다 문제점 npm 글로벌 설치가 되지 않는다 brew install로 하면 되긴 하지만, brew에는 없고 npm에는 있는... ts-Node 같은 package를 글로벌로 설치해야할 때 난감하다 이때까지는 어찌저찌 우회하던가 공부를 안하던가(?) 하는 방법으로 잘 피해왔다면 이젠 더이상 물러설 수 없다 해결방법 1. npm update npm을 최신 버전으로 업데이트 한다 sudo npm install -g n.. 공감수 0 댓글수 0 2023. 6. 6.
그냥 글 0. 개요 지난 한해동안 많은 일이 있었다. 이때까지 잡고 있던 수험생활을 접고, 개발자의 길로 들어섰다. 올해를 되돌아 보자면 늘 고민하고, 어떻게 하지 생각하다가 끝났다. 하지만 나아가야 할 방향에 대해 어느 정도 가닥이 잡혔다. 2022년에 대한 반성과 회고를 더불어, 2023년에 대한 다짐을 하고자 글을 남긴다 1. 국비 수업 html부터 css, javascript, php를 배우고 리액트와 뷰를 익혔다 처음엔 a태그가 이해가 안가서, flex가 내 맘대로 안되서 머리가 많이 아팠다 얘가 얘인건 아는데 왜 얘인지 몰랐다 또, for문으로 구구단 만들기, 자바스크립트로 이렇게 저렇게 돌리면 어떤 값이 나오징? 뭐 이런 넌센스같은(그 때에는 넌센스 퀴즈처럼 느껴졌지만 지금 생각해보면 기초를 잘 쌓지.. 공감수 0 댓글수 0 2023. 1. 23.
[넷플릭스 추천] 플레이리스트 스트리밍 서비스가 있기 이전에는 mp3에 파일을 담아 듣거나 앨범을 구매하여 원하는 노래를 들었었다. 저작권에 대한 인식이 희미하던 그 시절, 불법복제 파일이 인터넷에 떠돌게 되면서 사람들은 머지않아 음원도 디지털화 될 것이라고는 예상했다. 하지만 그 변화가 어떤 의미를 가지는지, 변화의 끝은 어디인지, 누구는 돈을 벌고 누구는 돈을 벌지 못하는지 쉽사리 예측하기 어려웠다. 기존의 음원 시장은 보수적으로 대응하며 음원의 디지털화를 막아섰지만, 이에 대하여 spotify는 어떻게 대응했는지, 어떻게 견고한 세계적인 기업이 될 수 있었는지에 대한 이야기이다. 이야기 전개 순서가 시간 순이 아닌, CEO, 개발자, 투자자, 저작권 문제를 해결할 변호사, 저작권을 가지고 있는 음반사 그리고 아티스트의 관점에서 .. 공감수 0 댓글수 0 2022. 12. 3.
1003. 공부 공감수 0 댓글수 0 2022. 10. 4.
vscode에서 JSDoc으로 깔끔하게 주석달기 개요 주석을 다는 방법을 통해서도 코딩 실력을 알 수 있다고 한다 주석을 다는 방법 중 하나인 JSDoc으로 어떻게 달아야 하는지 알아보고자 한다 https://youtu.be/ORmnc-hLrYs 본문 0. 언제쓰는가 함수 하나를 만들어놓고, 그 다음 함수에 대한 설명을 넣을 떄 주로 쓴다 이걸 활용하면 다른 사람이 보아도 한 눈에 들어오고 유지보수도 좋고 장점이 아주 많다 나 역시도 이걸 쓰고 있는데, 아주 얕게나마 쓰고 있다 그래서 말인데, 이번 기회에 정리하려고 한다 1. 함수를 만들자 const a = (a, b) => { return a + b; }; 2. 위에 주석을 달자 /** 이렇게만 치면 JSDoc comment가 뜨게 되고, 엔터를 치게 되면 다음과 같아진다 /** * * @param.. 공감수 1 댓글수 0 2022. 10. 1.
0917. 공부 1. Map Map 객체는 키와 값으로 이루어진 컬렉션 const map0 = new Map(); // Map(0) const map1 = new Map([['apple', 'banana']]); //Map(1) { 'apple' => 'banana' } 크기 확인 : _____.size; 요소 추가 : _____.set('key', 'value'); 요소 취득 : _____.get('key'); 존재 확인 : _____.has(___); 요소 삭제 : _____.delete('key'); 일괄 삭제 : _____.clear(); 2. Array 생성자 함수 Array 생성자 함수를 통해 배열을 생성할 수 있다. new Array(10); // [empty, empty, empty, empty, empt.. 공감수 0 댓글수 0 2022. 9. 18.
JS. VSCODE 에서 console.log 바로 보기 개요 늘 실습과 함께 공부를 했어서, console.log는 웹에서 찍어보았다 근데 막상 자료구조를 공부하려니 웹을 켤 필요가 많이 없었고 새로운 방법을 찾기 시작했다 본문 1. 확장프로그램에서 code runner을 설치한다 2. vs code를 껐다 켜서 코드를 짠다 3. 오른쪽 상단의 play 버튼을 누르면 밑에 콘솔이 찍힌다 와 이제 편하게 공부할 수 있다~~ 공감수 0 댓글수 0 2022. 9. 17.
0904. 공부 1. TS export type RootStackParamList = { SignIn: undefined; SignUp: undefined; } type SignInScreenProps = NativeStackScreenProps; function SignIn({navigation}: SignInScreenProps) { const toSignUp = useCallback(() => { navigation.navigate('SignUp'); }, [navigation]); return ... } 위와 같은 방법으로, navigation에는 내가 미리 지정한 값만 들어갈 수 있다 2. keyboardAvoidingView KeyboardAvoidingView 태그에 behavior: position을 줌으.. 공감수 0 댓글수 0 2022. 9. 4.
M1. 터미널에서 code 입력 시 vscode 안뜰 때 개요 노트북을 산 지 벌써 9개월이 되어간다 코딩하겠다고 샀는데, vscode 실행할 때 터미널에서 code 로 연적이 한 번도 없다 왜냐, /usr/local/bin/code: line 6: python: command not found /usr/local/bin/code: line 10: ./MacOS/Electron: No such file or directory 나도 모르겠다, 잘 안된다 그래서 9개월동안 헤매고 오늘이 되서야 방법을 찾았다 본문 https://trungk18.com/experience/bin-code-line-6-python-command-not-found/ Trung Vo A seasoned front-end engineer with 8 years of passion in cr.. 공감수 1 댓글수 2 2022. 9. 3.
아크레도 - 홈페이지에서 커스터마이징 하는 법 개요 아크레도를 가기 전, 집에서 간단히 커스터마이징을 해보고 싶었지만, 생각보다 홈페이지는 친절하지 않았고 집에서 커스터마이징을 하기엔 조금 많이 어려웠다 아크레도를 방문해서 직원이 직접 커스터마이징 하는 방식을 보니 그리 어려운 것은 아닌 것 같아 글을 작성해서 다른 사람들도 커스터마이징이 쉽도록 도움을 주려 한다 근데 나도 휴대폰으로는 안해봤다 1. 아크레도 페이지에 들어간다 아크레도 코리아가 아닌, 아크레도 웹으로 가야한다 https://www.acredo.kr/ Inspiring, 100% unique, international | acredo Made in Germany. Discover acredo now: 우리만의 웨딩밴드, 솔리테어링, 이터니티링을 디자인 해 보세요. Made in Ger.. 공감수 0 댓글수 0 2022. 8. 28.
방문후기. 아크레도 - 종로프리미엄점 (내돈내산) / 글 위주 반지를 어떻게 사게 되었나. 기존에 있던 반지가 급격히 불어난 살 덕분에 들어가지 않게 되었다 개발자라 타자를 칠 일이 많을 것 같지만 빠지지 않았고, 기존에 있던 반지를 두드려서 늘리니, 마니, 금을 추가해서 늘리니, 금을 추가하지 않고 최대한으로 늘리니 하다가 데일리로 활용이 가능한 반지를 새로 맞추는 것이 더욱 합리적이라 생각이 들어 여러 곳을 인터넷으로 찾아보고 반지를 둘러보고 괜찮았던 곳, 몇 곳을 예약 잡았다. 아크레도 방문 가장 첫 예약 장소가 종로 아크레도이다 사실 살이 찐지 꽤 오래되어서, 반지를 끼지 않은지 많이 오래되어서.... 반지를 맞춰도 될까, 살이 더 쪄서 반지가 안맞으면 어떡하지, 살이 빠져버려서 반지가 흘러내리면 어떡하지 뭐 이런 생각을 하고 있었다 그래서 꼭 반지를 사야겠.. 공감수 0 댓글수 0 2022. 8. 28.
0828. 공부 모두를 위한 컴퓨터 과학 (CS50 2019) 수료 공감수 1 댓글수 1 2022. 8. 28.
Next.js + styled component + Kakao 지도 api = 공부가 더 필요하다 결론: 처음부터 다시하자, 저 조합이 아닌 다른 조합으로 개요 제주도 여행을 계획하고 있다 단, 정해진 시간에 많은 걸 하고싶으니까 최대한 효율적으로, 시간을 알뜰살뜰 써야한다 그래서 생각해낸 토이프로젝트, 제주도 여행 계획짜기 웹이다 발단 일석이조, 누이좋고 매부좋고, 제주도 계획도 짜고 프레임워크도 미리 적응할겸 next.js + styled component 조합으로 제주도 여행을 짜고자 했다 전개 참고로 말하자면, 난 MBTI의 'P', 게으르진 않지만 많은 것들을 직관에 맞기는 편이다 왜냐, 큰 것들은 어찌어찌 계획짜고 실행하긴 하지만 작은 것들은 계획한답시고 미뤄지는 경우가 많기 때문이다 제주도 여행 웹도 그저 Next.js, styled component 사용해야하지라고만 생각했지, 그 이상.. 공감수 0 댓글수 2 2022. 8. 19.
CSS. blend-mode 개요 포트폴리오...포트폴리오...포트폴리오... 예쁘게 만들자 포트폴리오... 개념 요소가 겹칠 경우 색상이 어떻게 나타나야 하는지 정의한다 보통, z-index가 높은 값이 공간을 차지한다 (불투명한 종이를 겹친 것과 같다) 하지만 이를 조금 더 색다르게, 표현할 수 있다 nomal (기본 값) 최상단 색을 사용한다 background-blend-mode: nomal; multiply 최종 색은 전경과 배경색을 곱한 값이다. 검은 레이어는 최종 레이어를 검은 색으로 만들고, 하얀 레이어는 아무런 변화도 주지 않는다. 투명한 필름에 프린트한 이미지를 서로 겹친 것과 같다. background-blend-mode: multiply; screen 최종 색은 전경과 배경색을 각각 반전한 후 서로 곱해 나온 .. 공감수 0 댓글수 0 2022. 5. 3.
CSS. filter 속성 이해하기 개요 포트폴리오의 계절이 왔다 잘 몰랐는데, filter을 사용하니 글이나 이미지, 모든게 돋보인다 Lorem Ipsum과의 반대이다 개념 흐림 효과나 색상 변형 등 그래픽 효과를 주기 위해 CSS에 적용한다 보통 필터는 이미지, 배경, 테두리, 렌더링을 조정할 때 쓰인다 블러 효과 (blur) 가우시안 블러를 적용할 수 있다(뿌옇게) 값이 클수록 이미지가 흐려진다 filter: blur(5px); brightness() 이미지의 명암을 준다 0%는 검은색이고 100%일 경우 이미지가 그대로 유지된다 filter: brightness(0.4); contrast() 이미지의 대비를 조정한다 0%인 경우 회색 이미지가 되고 100%인 경우 이미지가 더 유지된다 100%보다 큰 값도 허용되며, 이때는 대비가.. 공감수 0 댓글수 0 2022. 5. 3.
HTML. Lorem이 뭔가? 자동완성기능 개요 코딩을 하기 전에, HTML을 먼저 채워야 하는 순간이 온다 예를 들면 대략의 디자인을 보려고 글씨를 먼저 채워넣는다던지, 아무 글씨나 채워넣고 구성만 맞춰보고 싶던지.. 그럴 때 쓰는 것이다 즉, 아무 의미가 없는 긴 글이 필요할 때 쓰는 거다 사용법 아주 쉽다 vs code를 켜고 lorem을 친 후 엔터를 치면 나온다! lorem (+ enter) 자세한 사용법 '+ 엔터' 는 그냥 엔터를 치는 거다 어찌 설명을 해야 편할지 몰라서 그냥 저렇게 적으니 너그럽게 이해 바란다 lorem + 엔터 -> 한 단락의 더미 텍스트(아무말 대잔치) 작성 lorem5 + 엔터 = lorem(숫자) + 엔터 -> 단어 수 만큼 더미 텍스트(아무말 대잔치) 작성 lorem*5 + 엔터 = lorem*(숫자) .. 공감수 0 댓글수 0 2022. 5. 2.
CSS. 우선순위 속성 값 뒤에 !important 를 붙인 속성 HTML에서 style을 직접 지정한 속성 #id 로 지정한 속성 .클래스, :추상클래스 로 지정한 속성 태그이름 으로 지정한 속성 상위 객체에 의해 상속된 속성 공감수 0 댓글수 0 2022. 4. 15.
CSS. 말 줄이기! 한 줄 효과 .ellipsis1 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 두 줄 효과 .ellipsis2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } 세 줄 효과 .ellipsis3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } 공감수 0 댓글수 0 2022. 4. 15.
HTML. 버튼에 onclick? 개요 a 태그를 쓰지 않아도 링크를 걸 수 있는데, 그 방법 중 하나가 onclick을 사용하는 것이다 현재 창에서 링크 이동 버튼 새 창에서 링크 이동 버튼 맨날 사용할 때마다 찾아봐야해서 귀찮았는데 이참에 정리해야겠다 공감수 0 댓글수 0 2022. 4. 15.
CSS. box-sizing box-sizing: content-box; (기본) 콘텐츠 영역만 포함되고 여백과 테두리는 포함되지 않음 box-sizing: border-box; 바깥 여백은 포함하지 않음 공감수 0 댓글수 0 2022. 4. 15.
CSS. 색 조합 찾기 좋은 사이트 추천 속는 셈 치고 들어가보자 믿는 자에게 축복이 내린다. https://huemint.com/back-gradient-2/ 공감수 0 댓글수 0 2022. 4. 15.
HTML. input 유형 공감수 0 댓글수 0 2022. 4. 15.
PHP. sql 정리(4) JOIN 정리 JOIN 문법 SELECT * FROM __table1__ JOIN __table2__ ON __조건__; INNER JOIN(교집합) SELECT * FROM __table1__ INNER JOIN __table2__ ON __조건__; LEFT OUTER JOIN ( 교집합 + 왼쪽 테이블 전체) SELECT * FROM __table1__ LEFT OUTER JOIN __table2__ ON __조건__; RIGHT OUTER JOIN(교집합 + 오른쪽 테이블 전체) SELECT * FROM __table1__ RIGHT OUTER JOIN __table2__ ON __조건__; CROSS JOIN(테이블을 곱으로 나타내서 아주 양이 방대해짐) SELECT * FROM __table1__ CROSS.. 공감수 0 댓글수 0 2022. 4. 14.
PHP. sql 정리(4) 함수 정리 UPPER(str) : 대문자 변환 LOWER(str) : 소문자 변환 INITCAP(str) : 첫 글자만 대문자로 변환 CONCAT(str, tmp) : 두 문자값 결합 SUBSTR(str,a,b) : 문자 추출 a = 시작위치, b = 개수 LENGTH(str) : 문자열 길이 반환 L/RPAD(대상,총길이,채울문자열) : 대상 문자열에 채울문자열을 총길이만큼 채워서 반환 LPAD('001',7,'0') ▶ 0000001 LTRIM, RTRIM(대상, 제거할 문자열) : 대상 문자열에서 제거할 문자열을 없앤 뒤 반환 select LTRIM('00010' , '00') ▶ 010 REPLACE(대상문자열,바꾸고싶은대상,바꾸고싶은내용) : 대상문자열에서 바꾸고 싶은 대상을 바꾸고 싶은 내용으로 수정한 .. 공감수 0 댓글수 0 2022. 4. 14.
PHP. sql 정리(3) 각종 조건들 WHERE 각종 조건을 조회 가능 AND OR NOT 사용 가능(쿼리 읽는 순서는 NOT. AND. OR) like사용하면 포함된 글자 사용 가늠 ex) where like 김% -> 김으로 시작하는 결과 값 찾을 수 있음 LIMIT 조회되는 결과 값을 제한 가능 ex) LIMIT 3; -> 3개 조회 ex) LIMIT 3 5; -> 3번째 부터 5개 조회 GROUP BY 데이터를 그룹으로 짓는다 주로 갯수를 셀 때 사용함 ORDER BY 특정 칼럼을 기준으로 정렬 ASC : 오름차순 DESC : 내림차순 DISTINCT 중복 행 제거 ALIAS 별칭 여러 개의 테이블을 다룰 떄 아주 유용 ex) SELECT memberID a , boardID b FROM myMember a, myBoard b; 공감수 0 댓글수 0 2022. 4. 14.
PHP. sql 정리(2) select SELECT 원하는 정보만 쏙 쏙 골라서 뽑을 수 있다 모든 컬럼 조회 SELECT * FROM _테이블명_; 원하는 컬럼만 조회 SELECT _원하는 컬럼_ FROM _테이블명_; 원하는 조건 + 원하는 컬럼 조회 SELECT _원하는 컬럼_ FROM _테이블명_ WHERE _조건_; 문법 순서 SELECT -> FROM -> WHERE -> GROUP BY -> HAVING -> ORDER BY 쿼리 실행 순서 FROM -> WHERE -> GROUP BY -> HAVING -> SELECT -> ORDER BY 공감수 0 댓글수 0 2022. 4. 14.
PHP. sql 정리(1) create / insert / delete / update CREATE 테이블 생성 CREATE TABLE __테이블명__ ( 칼럼명 타입 조건(not null 등), 칼럼명 타입 조건(not null 등), 칼럼명 타입 조건(not null 등), PRIMARY KEY ~~ ); INSERT 데이터 삽입 INSERT INTO __테이블명__ (__필드 목록__) VALUES (__값 목록__); UPDATE 값 수정 UPDATE 테이블 SET 칼럼 = '값' WHERE 조건; DELETE 데이터 삭제 DELETE FROM _테이블_ WHERE _조건_; 공감수 0 댓글수 0 2022. 4. 14.
CSS. flex 항목에 지정가능한 속성들 개요 수업을 듣다보니 flex: 0 0 30%; 는 반응형이 안되고 flex: 1 1 30%;는 반응형이 된다고 하셨다 왜지? 왜일까? 그 이유를 알아보고자 한다 flex 구성 flex: flex-grow, flex-shrink, flex-basis; flex는 flex-grow, flex-shrink, flex-basis가 온다고 한다 이 세 가지를 하나씩 알아보자 flex-grow 할당받는 크기를 지정한다 1이라고 하면 모두 1만큼의 공간을 지정받으나 어느 하나의 값이 2라면 걔는 1의 2배 만큼의 공간을 지정 받는다 그림으로 보여줘야 쉬울거 같다 https://developer.mozilla.org/ko/docs/Web/CSS/flex-grow flex-shrink 얼마나 축소될지 정해준다 즉, g.. 공감수 0 댓글수 0 2022. 4. 14.

문의안내

티스토리
로그인
고객센터

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