Blog 프로젝트 생성

2024년 12월 25일

이 글의 목표: 프로젝트를 생성해서 서버를 띄워본다.

mix phx.new blog --database sqlite3 DB를 sqlite로 사용

프로젝트가 생성되고 나면 다음과 같은 메시지가 표시된다.

We are almost there! The following steps are missing:
cd blog

Then configure your database in config/dev.exs and run:
mix ecto.create

Start your Phoenix app with:
mix phx.server

You can also run your app inside IEx (Interactive Elixir) as:
iex -S mix phx.server

일단 시키는대로

cd blog
mix ecto.create
mix phx.server를 입력해서 서버를 실행시켜 보면 다음과 같이 표시된다.

[info] Migrations already up
[info] Running BlogWeb.Endpoint with Bandit 1.6.1 at 127.0.0.1:4000 (http)
[info] Access BlogWeb.Endpoint at http://localhost:4000
[watch] build finished, watching for changes...

그리고 브라우저에서 http://localhost:4000에 들어가 보면 Phoenix의 환영 화면이 보인다.

끝! 간단하다!

너무 간단하니 코드를 조금 살펴보면...

Phoenix의 환영 화면은 lib/blog_web/controllers/page_html/home.html.heex에 있다.
heex(HTML+EEx)파일은 HTML과 Elixir 표현식을 결합한 템플릿 파일이다.

라우터 파일은 lib/blog_web/router.ex파일이다.
다음과 같이 되어있는 부분이 서버가 각 경로를 어떤 컨트롤러로 처리하는지 정의하는 부분으로 보인다.

scope "/", BlogWeb do
    pipe_through :browser

    get "/", PageController, :home
end

lib/blog_web/controllers/page_controller.ex 파일에는 이 경로의 요청에 대해서 어떻게 처리하는지가 정의 되어있는 부분이다.
그래서 lib/blog_web/controllers/page_controller.ex 파일을 다음과 같이 고치고

defmodule BlogWeb.PageController do
    use BlogWeb, :controller

    def home(conn, _params) do
        # The home page is often custom made,
        # so skip the default app layout.
        render(conn, :home, layout: false)
    end

    # 추가한 부분
    def hello(conn, _params) do
        render(conn, :hello, layout: false)
    end
end

lib/blog_web/router.ex 파일을 다음과 같이 고치고

scope "/", BlogWeb do
    pipe_through :browser

    get "/", PageController, :home
    get "/hello", PageController, :hello
end

lib/blog_web/controllers/page_html/hello.html.heex 파일을 추가해서 다음과 같이 작성하면

<h1>Hello World</h1>

http://localhost:4000/hello에 Hello World가 보인다.