build.gradle(:app)

def localProperties = new Properties()
def localPropertiesFile = rootProject.file('local.properties')
if (localPropertiesFile.exists()) {
localPropertiesFile.withReader('UTF-8') { reader ->
localProperties.load(reader)
}
}

def flutterRoot = localProperties.getProperty('flutter.sdk')
if (flutterRoot == null) {
throw new GradleException("Flutter SDK not found. Define location with flutter.sdk in the local.properties file.")
}

def flutterVersionCode = localProperties.getProperty('flutter.versionCode')
if (flutterVersionCode == null) {
flutterVersionCode = '1'
}

def flutterVersionName = localProperties.getProperty('flutter.versionName')
if (flutterVersionName == null) {
flutterVersionName = '1.0'
}

apply plugin: 'com.android.application'
apply from: "$flutterRoot/packages/flutter_tools/gradle/flutter.gradle"

android {
compileSdkVersion 28

lintOptions {
disable 'InvalidPackage'
}

defaultConfig {
// TODO: Specif…

부트스트랩 로그인 뷰

이미지
#1. html

    <!-- 로그인 뷰 -->
    <div class="login-background vertical-center">       
        <div class="card mx-auto border-0">
            <h1 style="margin-bottom: 60px;">에이스에어컨 관리자</h1>
            <div class="card-body text-center">
                <form class="login-form">                   
                    <div style="margin-bottom: 60px;"><img src="https://engineering.linecorp.com/wp-content/uploads/2019/08/flutter1.png" style="width: 128px;"/></div>
                    <div class="form-group">
                        <input type="email" class="form-control" placeholder="이메일 아이디">
                    </div>
                    <div class="form-group">
                        <input type="password" class="form-control" placeholder="비밀번…

부트스트랩 헤더 네비바

이미지
<header>
        <nav class="navbar bg-light px-4 navbar-expand-sm d-flex">
            <a class="navbar-brand mr-5" href="/">에이스에어컨 관리자</a>

            <ul class="navbar-nav mr-auto">
                <li class="nav-item">
                    <a class="nav-link" href="/">접수목록</a>
                </li>
            </ul>

            <ul class="navbar-nav ml-auto">
                <li class="nav-item">
                    <a class="nav-link" href="/">로그인</a>
                </li> 
                <li class="nav-item">
                    <a class="nav-link" href="/">접수하기</a>
                </li> 
                <li class="nav-item">
                    <a class="nav-link" href="/">로그아웃<…

노토산스 웹폰트 스타일로 적용하기

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR');

body {
    font-family: 'Noto Sans KR', sans-serif;
}

파이어베이스 + 부트스트랩 + 뷰 기본 페이지

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 파이어베이스 -->
    <script defer src="/__/firebase/7.14.2/firebase-app.js"></script>
    <script defer src="/__/firebase/7.14.2/firebase-auth.js"></script>
    <script defer src="/__/firebase/7.14.2/firebase-database.js"></script>
    <script defer src="/__/firebase/7.14.2/firebase-messaging.js"></script>
    <script defer src="/__/firebase/7.14.2/firebase-storage.js"></script>
    <script defer src="/__/firebase/init.js"></script>

    <!-- 부트스트랩 -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.…

노드에서 ejs 로 include 하기

<%- include('./header'); %>

끝에 ; 세미콜론을 넣어주니 에러가 나질 않는다.

물론 같은 경로에 header.ejs 파일이 있어야 한다.

뷰로 파이어스토어 데이터 리스트 보여주기

이미지
#1. 뷰 스크립트 CDN

    <!-- vue js -->
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>


#2. html
    <div class="container mt-5 pt-4" id="app">         <!-- 인사말 리스트 -->                 <ul class="p-0">             <li class="card my-2 p-4" v-for="post in posts">                 <p class="card-text">{{ post.message }}</p>             </li>         </ul>      </div>

#3. script
    $('.post-form').submit((e) => {         e.preventDefault();
        const newPost = firebase.functions().httpsCallable('newPost');         newPost({                 message: $('textarea[name="message"]').val()             })             .then((result) => {                 console.log('성공', result);                 $('form')[0].reset();             })             .catch((error) => {                 console…

firestore에 functions를 이용해서 글 올리기

이미지
#1. functions/index.js

const functions = require('firebase-functions');
const admin = require('firebase-admin');
admin.initializeApp();

exports.newPost = functions.https.onCall((data, context) => {

    return admin.firestore().collection('posts').add({
        message: data.message,
        date: admin.firestore.FieldValue.serverTimestamp(),
        visits: 0
    })
    .then(() => {
        return { code: 'OK' };
    });

});

* then을 쓰지 않으면 서버 에러가 난다.


#2. post.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 부트스트랩 -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https…