'분류 전체보기'에 해당되는 글 3건

안녕하세요? 프리입니다.

이번에는 구글 클라우드 플랫폼에서 FTP를 접속하는 방법입니다.

저는 톰캣으로 웹서버로 구글 클라우드 플랫폼을 사용하고 있습니다.

 

이 FTP는 아마 OS 내부 파일을 보여주는 것으로 보입니다.

그래서 특정 디렉토리만 보이게 하려면 vsftp등 따로 ftp 프로그램을 설치하는 것을 추천드립니다.

물론 디렉토리를 찾아야한다는 귀찮음만 뺀다면 그냥 쓰셔도 무방합니다.

 

그래서 한번 구글 클라우드 플랫폼에서 FTP를 사용해보도록 하겠습니다.


www.putty.org/

 

Download PuTTY - a free SSH and telnet client for Windows

Is Bitvise affiliated with PuTTY? Bitvise is not affiliated with PuTTY. We develop our SSH Server for Windows, which is compatible with PuTTY. Many PuTTY users are therefore our users as well. From time to time, they need to find the PuTTY download link. W

www.putty.org

먼저 위 링크에서 putty를 다운받습니다. (현재 윈도우만 지원합니다.)

그리고 PuTTYgen이라는 프로그램도 같이 있을 것입니다.

이 프로그램을 실행합니다.

그 후 여기에서 Generate라는 버튼을 누르고 빈 공간에서 마우스를 마음껏 휘저어줍니다.

그러면 이렇게 키가 생성되었습니다.

여기에서 keycomment는 FTP의 아이디로 사용됩니다. 그래서 디폴트로 놔두는 것 보다 따로 수정하는 걸 추천드립니다.

그리고 키를 컨트롤+A,C,V에서 메모장에 잠시 붙여넣기 해줍시다.

 

또한 save private key를 눌러 키를 한번 더 저장합니다.

그 후 GCP에 다시 들어가서 Computer Engine - 메타데이터에 접속합니다.

메타데이터 탭에서  SSH키-수정으로 들어갑니다.

그리고 아까 메모장에 복사해놓았던 키를 새 항목을 추가 한 후 빈칸에 붙여넣습니다.

그 후 저장까지!

 

이제 파일질라를 엽니다.

그 후 메뉴-편집으로 들어가서 SFTP에 아까 저장해두었던 키(save private key) 파일을 추가합니다.

gcp에 다시 한번 가서 인스턴트의 외부 IP를 기억합니다.

그리고 파일질라 호스트에는 sftp://외부IP주소를 넣습니다.

그러면 이렇게 정상적으로 ftp 접속이 완료됩니다.


이상입니다!

블로그 이미지

MSP 프리 Peuri

개발, OS, 강좌를 올리는 블로그입니다.

안녕하세요! 프리입니다 :)

벌써 어쩌다보니 한달만에 글을 써보네요..ㅋ

 

오늘 올릴 강좌는 php include를 사용에 웹페이지의 헤더와 푸터를 분리해보겠습니다.

 

먼저 헤더와 푸터를 분리하는 이유에 대해서 알아보자면,

헤더와 푸터가 한 코드 안에 다 들어가있으면 먼저 코드가 복잡해집니다.그래서 혹시나 잘못해서 오류같은 것이 날 가능성이 있다는 말도 됩니다.

 

그리고 하나 더, 변경사항을 수정하기가 매우 번거롭습니다.만약 헤더의 타이틀을 수정한다면 다른 것까지 모두 수정을 해야한다는 말이 됩니다.그래서 매우매우 번거롭고 귀찮아집니다.

 

그래서 한번 헤더/푸터를 분리해도록 하겠습니다.

참고로 저는 php를 사용하였습니다.


먼저 저는 이렇게 헤더/푸터를 각각 다른 파일들로 분리해두었습니다.

참고로 여기에서 중심이 될 파일은 index.php가 중심이 됩니다.

먼저 헤더에는 말 그대로 헤더 부분을 작성해줍니다.

다른 파일에도 동일하게 작성해주시면 됩니다.

 

그리고 아까 말했던 중심이 될 파일, index.php에 내용을 추가해줄 예정입니다.

아까 말했던 중심 파일, index.php에 코드를 하나 추가해주면 됩니다.

<?php (include 'head.php'); ?>

위 코드입니다.

이걸 넣으면 head.php 파일이 index.php 코드에 삽입됩니다.

 

실제 적용된 코드입니다.

이렇게 index.php에 head.php가 들어간 모습입니다.

이걸 활용하면 여러 다양한 활용이 가능합니다.


이상. 프리입니다!

블로그 이미지

MSP 프리 Peuri

개발, OS, 강좌를 올리는 블로그입니다.

안녕하세요? 프리입니다!

 

오늘은 첫 강좌로, 이번에는 HTML을 소개해드리고, 알려드리려고 합니다! 먼저 HTML은 흔히 프로그래밍 언어라고 생각하시겠지만, 프로그래밍 언어라기보다는 마크업 언어에 더욱 가깝습니다. 사이트에서 주소에 흔히 ~~~.html 이란 것을 흔하게 볼 수 있는데, 이것이 바로 HTML로 작성된 페이지입니다.

 

그리고 코딩시 편한 점이 많습니다. 문법 오류에 매우 관대한 언어라서 <h1>테스트 이렇게 작성을 해도 정상적으로 결과가 표출됩니다. 또한 여러 태그들만 기억해놓으면 쉽게 사이트를 하나 뚝딱 만드는 것도 가능합니다.

 

그래서 이제 한번 본격적으로 만들어보도록 하겠습니다!


자, 먼저 에디터를 켭시다. 에디터라고 해서 거창한게 아닙니다. 여러분 손에 들고 있는 종이와 펜도 에디터가 될 수 있고, 윈도우 기본 프로그램인 메모장도 에디터가 될 수 있습니다. 저는 참고로 vscode를 사용하고 있습니다.

 

먼저 본격적으로 코딩을 시작하자면, 위 코드 <!DOCTYPE html>을 먼저 써줍니다. 이 코드는 이 문서가 HTML 5로 작성되었다는 것을 알려줍니다.

 

그 후에는 <html></html>을 적어줍시다. 이 태그는 안에 내용이 html으로 작성되었다는 것을 알려주는 태그이고, 이 태그 안에서 본격적으로 모든 코딩이 이루어집니다.

 

 

그 다음 우리가 작성할 태그는 head입니다. 이 태그는 말 그대로 프레임워크를 적용하거나 스타일, 스크립트 같은 것을 넣을때는 보통 head 안에 넣습니다.

 

이제는 title 태그를 작성합니다. 이 태그는 사이트의 제목을 정하는 태그입니다. 예를 들어 사이트 제목이 안녕하세요라면, <title>안녕하세요.</title>라고 작성해주시면 됩니다.

 

또한 바디 태그를 넣어주시면 됩니다. 이 바디 태그 안에서 글자를 넣거나, 모양을 넣거나.. 하는 일들이 모두 이루어집니다.

 

이제 바디에 글자를 넣어보겠습니다.

글자도 태그에 따라서 크기가 정해지는데요!

 

<h1>

<h2>

<h3>

<h4>

<h5>

<h6>

 

이렇게 되어있습니다. 숫자가 클을 수록 글자가 작아지고, 숫자가 작을 수록 글자가 커집니다. 그래서 제일 큰 글자는 h1입니다. 

그리고 <p> 태그도 있는데, 이것은 문단을 만들때 사용하는 태그입니다.

 

줄바꿈을 하려면 <br>을 사용하여 바꾸면 됩니다. 2칸을 띄우려면 <br><br> 이렇게 br을 2개를 써주시면 됩니다.

<h1>h1태그는 제일 크기가<br>크다.</h1>

이렇게 작성한다면 출력은

 

h1 태그는 제일 크기가

크다.

 

이렇게 출력됩니다. 

 

이렇게 간단하게 코드를 작성해봤습니다. 이것을 확장자는 html로, 이름은 자유롭게 해주시고 실행해보겠습니다.

그러면 알 수 없는 외계어가 나올 것입니다. 당황하지 말고, 인코딩을 안하여 글자가 깨져보이는 것 입니다. head에 아래 코드를 넣어봅시다

<meta charset="utf-8">

그라면은 이렇게 정상적으로 출력이 됩니다!

 

 

정리

 

 

 

<!DOCTYPE html>
<html>
	<head>
   		<meta charset="utf-8">
    	<title>Hello Would</title>
    </head>
    <body>
    	<p>Hello Would!</p>
    </body>
</html>
블로그 이미지

MSP 프리 Peuri

개발, OS, 강좌를 올리는 블로그입니다.