Code Monkey home page Code Monkey logo

next-postgres's Introduction

next-postgres

This is an example of a full stack web application with...

  • posts
  • comments
  • server side rendering.

And you can deploy it to...

Feel free to use without attribution.

Production Examples:

Preview:

Stack

Why is this useful? Why should I care?

  • A nice starting point with bad UX/UI so you can change things freely.
  • Some "production ready" are concepts baked in for you.
  • You'll get server side rendering for free.
  • You can move faster at a hackthon.

Setup: Prerequisites

I use Homebrew to manage dependencies on a new laptop... You're welcome to use something else.

  • Install Postgres: brew install postgres.
  • Install Node 10.7.0+: brew install node. (Or update your node)

Setup: Quick newbies guide to Postgres

  • On OSX, to run Postgres in a tab on the default port.
postgres -D /usr/local/var/postgres -p 5432
  • Postgres config is stored in ./config.js.
  • Local database: sampledb.
  • Username and password as test.

First time Postgres instructions.

# Enter Postgres console
psql postgres

# Create a new user for yourself
CREATE ROLE yourname WITH LOGIN PASSWORD 'yourname';

# Allow yourself to create databases
ALTER ROLE yourname CREATEDB;

# Exit Postgres console
\q

# Log in as your new user.
psql postgres -U yourname

# Create a database named: sampledb.
# If you change this, update config.js
CREATE DATABASE sampledb;

# Give your self privileges
GRANT ALL PRIVILEGES ON DATABASE sampledb TO yourname;

# List all of your databases
\list

# Connect to your newly created DB as a test
\connect sampledb

# Exit Postgres console
\q

I also use a GUI called TablePlus if you don't like command line.

Setup: Run locally

In the root directory run these commands:

npm install
npm install -g babel-cli
npm install -g sequelize-cli
sequelize db:migrate
npm run dev

Visit localhost:8000 in a browser to start development locally. You will need postgres running.

Deploy Heroku

To deploy with Heroku, please follow the instructions here.

There are very specific details you must pay attention to.

Deploy Google App Engine

Please set up Google App Engine and download the Google Cloud SDK so you can use gcloud from the command line.

You will need to add an app.yaml. It will look something like this:

runtime: nodejs
env: flex

manual_scaling:
  instances: 1

resources:
  cpu: 1
  memory_gb: 0.5
  disk_size_gb: 10

env_variables:
  NODE_ENV: production
  PRODUCTION_USERNAME: your-database-username
  PRODUCTION_PASSWORD: your-database-user-password
  PRODUCTION_DATABASE: your-database-name
  PRODUCTION_HOST: your-database-host
  PRODUCTION_PORT: your-database-port
  PRODUCTION_SECRET: your-secret

Be sure to read the documentation

Make sure you add app.yaml to the .gitignore. You don't want to commit this file into your project.

Then run npm run deploy. This configuration will cost you ~$40 a month.

What happened to Zeit's Now service?

Now 2.0 is about serverless everything. And this example doesn't work with Now 2.0

Questions?

Feel free to slang any feels to @wwwjim.

next-postgres's People

Contributors

jimmylee avatar huyhong avatar pruhstal avatar whyrusleeping avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.