Code Monkey home page Code Monkey logo

red-spacecraft's Introduction

RED SPACECRAFT

a Search engine of people from the Star Wars universe and display their information

Development

when working on a new fature or issue, please create a new branch (with clear name related to the feature), and do a commit (with clear message) for every small changes instead of large changes.

Local Development Setup

  1. Clone this Repo
  2. run yarn install in the project root directory to install all dependencies
  3. run yarn dev to start development server

Colaborating

when picking up an issue (before starting your work), please open some discussion (if needed). This is important to make us more clear about the issue. then based on master create a new branch to work with

Project Structures

The codes are mainly in Typescript and splited into two directories,

Backend - /src/backend

is a NodeJS Express server that run on port 3001 or assigned port in PORT system environment (this is used by heroku).

  • /api, this is our API backend. Every folder in this directory will be the endpoint name with two files, the controller.ts and route.ts file.

    all endpoint can accept an :id param to get the data by id.

    • /films, endpoint to get the list of all films
    • /person, endpoint to get all person.
    • /planet, endpoint to get all planet.
    • /species, endpoint to get all species.
  • /swapi, this is the upstream API for managing call to SWAPI API

    • /index.ts, hold the Swapi class to manage all action needed for SWAPI stuff.
    • /schema.ts, SWAPI schema definition for data transformation goes here.

Frontend - /src/frontend

created using Create React App

  • /assets, all asset should goes here. like icons, global CSS styles, fonts, images, etc.
  • /components, all reusable (shared across features) component should goes here.
  • /features, all features should be inside this directory, including a __test__ folder for each feature (if needed).
  • /utils, all commons utility or helper function should be inside this directory.

Naming Convention

  • File names must be all lowercase and may include underscores (_) or dashes (-), but no additional punctuation.
  • Component names must be in UpperCamelCase with clear definition. eg, don't use CustomButton, use more meaningful name like RoundedButton. the extension must be .tsx
  • Test file names must be all lowercase and may include dashes (-), but no additional punctuation. followed by .spec and extension must be .ts or tsx

Pull Request

make a small PR as much as you can rather than one big PR. and please test it locally before creating PR (I know, we have Github Action for this ๐Ÿ˜ƒ ).

after creating a pull request, please assign your self and request for review from another member. write clear description about the PR to give better understanding for the reviewer.

If PR is not ready for review yet, please create a DRAFT pull request first.

If your PR is in a review state, but you have a new changes related to the opened PR. please DON'T push this changes to the current open PR. just create a new branch and then create a new PR with target branch pointed to the old PR. if the old PR already merged into master, then it safe to target the master branch. this will not confusing the reviewer ๐Ÿ˜ƒ

Staging Environment

When PR merged into staging branch, it will run github workflow for automatic deployment into staging at https://red-spacecraft-staging.herokuapp.com

Production Site

When staging branch merged into master, it will deployed automatically and available at https://red-spacecraft.herokuapp.com

Show your Support

To show your support for my work on this project:

red-spacecraft's People

Contributors

pahrizal avatar

Stargazers

 avatar

Watchers

James Cloos avatar  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.