Giter Site home page Giter Site logo

pycontw-frontend's Introduction

pycontw-frontend ci pycontw-frontend cd nuxt

pycontw-frontend

Frontend of PyCon TW official website.

Set up a Development Environment

Requirements

  • node >= 14.21.3

You can refer to package.json file for more details.

Method 1: Develop on your local machine

  1. Clone this repository.

  2. Add Environment Variables to configure this project:

    export BUILD_TARGET=server
    export HOST=127.0.0.1
    export BASE_URL=http://127.0.0.1:9876
    export API_URL_BROWSER=http://127.0.0.1:9876
    export VUE_DEVTOOL=true
  3. Install dependencies:

    npm install
  4. Serve with hot reload at localhost:3000:

    npm run dev
  5. Also, we have mock server to handle API on local:

    # You need to add Environment Variables(Step.2). Otherwise, some of the pages may not work correctly.
    npm run json-server

Method 2: Run Development Server with Docker

  1. Clone this repository.
  2. Simply run the docker-compose commands to launch or stop the mock API server & the dev server:
# Launch the dev server and the mock API server
docker-compose -f ./docker-compose-dev.yml up

# Stop the dev server and the mock API server
docker-compose -f ./docker-compose-dev.yml down

Start to contribute

  • You can choose method 1 or method 2 to build setup, then you can start to contribute. ๐Ÿ™Œ
  • Please follow Github Flow.

Build for production and launch server

npm run build
npm run start

# Or just run:
npm run serve

Generate static project

npm run generate

Archiving the Historical PyCon TW Website

1. Check out the uptodate branch like `pycontw-2021` or `pycontw-2022`.
git checkout pycontw-2021
  1. (Optional) Install dependencies
npm i
  1. Edit nuxt.config.js and set DEFAULT_BASE_URL to the corresponding API endpoint like https://tw.pycon.org/prs.

  2. Generate static project

ROUTER_BASE="/2021/" npm run generate

Check your code:

npm run lint

For detailed explanation on how things work, check out Nuxt.js docs.

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.