주섬주섬 코딩, 소소하지만 꾸준히 쌓아가는 개발 기록...

기존의 3차에서 썼던 소스를 활용해서 계속 수업을 진행했습니다. 잘 있나 npm run serve를 한 번 해보고 시작합니다. 잘있으면 일단 첫번째로는 인스타에 올릴 때 필터효과를 사용해보도록 하겠습니다. cssgram 을 사용할 것인데요, 전 처음 알았어요 https://una.im/CSSgram/ CSSGram What is This? For more background on CSS Image Effects, you can check out my blog series here, or watch my video from CSS Conf EU, which gives a baseline on blend modes and filters. Simply put, CSSgram is a library for ed..

리다이렉션이란 사용자 지정 위치로 우회시키는 방법입니다.(출력의 방향을 바꾸는) 예를 들어서 내가 만약 네이버로 접속했는데, 네이버에서 다음으로 리다이렉션 시킨다면 나는 네이버를 들어갔어도 결론적으로 다음 사이트에 들어가지게 됩니다.^^ 보통 리다이렉션을 js로 작업하는데, 접근한 사용자에 따라 분기를 해서 리다이렉트를 시키는 경우라면 아래와 같이 작업을 합니다. if( user == '유저이름' ) { window.location.href = '이 유저에게만 보여줄 주소'; } 근데 이번에 관련 검색을 하던 중에 태그에도 리다이렉트 기능이 있다는 것을 알게되었습니다. 물론, 태그니까 강제로 태그를 수정하는 작업은 하지 말고, 심플하게 사용할 때 쓰도록 하면 좋을 것 같습니다. 비공개 페이지로 사용자가 ..

*이미지 출처는 https://pixabay.com/ 이고, 무료이미지(19.07 기준)여서 사용했습니다. 문제가 있을 시 삭제하겠습니다. 이제 어느덧 코딩애플에서 진행하는 기초 세미나 3/4가 지났습니다 ㅎㅎㅎㅎ!! 근데,, 사실은 이걸 처음 작성할 때는 다음주가 마지막이었는데 ㅋㅋㅋ 수정하고 있는 지금은, 벌써 4주차가 끝난 뒤입니다.^^; 하핫.... 3회차 수업은 라우터를 사용하지 않았습니다. 어떤 작업을 했는지, 체크해보면 1.메인에 리스트를 보여줄 것입니다. - '사용자이름, 타이틀, 텍스트, 이미지' 2.메인에서 이미지 업로드 버튼(+)을 누르면 사진을 업로드 할 수 있고 두 번째 레이아웃이 보여집니다. 3.두 번째 레이아웃에서는 업로드한 사진을 보여주고, 텍스트나 글쓴이 등 정보를 입력받는..

*예시에 사용한 비디오는 유튜브 장삐쭈님 것을 가져다가 사용하였습니다. css만으로 반응형 비디오 만들기 동적인 값을 구할 때, 보통 js를 많이들 사용합니다. 하지만, 효율적인 이유로 css로 가능한 부분은 js로 컨트롤 하지 않죠. javascript를 사용하지 않고 css만으로 유튜브에서 가져온 비디오를 반응형으로 만들어보도록 하겠습니다. 먼저 내가 반응형으로 작업하려는 비디오의 비율을 알아야합니다. 보통 데스크탑에서의 비디오 비율은 16:9 이지만, 아닌 경우도 있으므로 비율을 알고 계산을 진행하도록 합니다. 16:9 비율의 해상도 표 2160p 3840x2160 1440p 2560x1440 1080p 1920x1080 720p 1280x720 480p 1280x720 360p 640x360 24..