Deriv.com - An online trading platform that offers a wide selection of derivatives to trade on 24/7.
- Other documents
- Pre-installation
- Quick start
- How to contribute
- Manage translations
- Manage releases
- Test link deployment
- FAQ
- General implementation - Contain ways to do development in deriv.com
- Development guidelines - Contain advice for developers working on this project
- Git best practice - Contain git practices and commit guidelines
- File structures
- GTM workflow - Contains Google Tag Manager workflow and additional information
- Translation workflow - Contains general workflow and commands required for our translation process
- Typescript guidelines - Contains Typescript guidelines and conventions for this project
Before running or contribute to this project, you need to have the setup of the following packages in your environment
- node >=16.6.0
- npm >=8.11.0
- git (for
contribution
) - gatsby-cli (npm install -g gatsby-cli) (for using commands that aren't listed in scripts)
Moreover, having these extensions will help you to speed up the development process and adhere to the best practices
- Prettier: setup in your editor https://prettier.io/ (or you can run
npm run format
. Installation guide for VS Code - https://www.codementor.io/@myogeshchavan97/how-to-automatically-format-code-in-visual-studio-code-using-prettier-1nebhfbxak WebStorm - https://www.jetbrains.com/help/webstorm/prettier.html#prettier_before_you_start - Stylelint: setup in your editor https://stylelint.io/ (or you can run
npm run stylelint
) - Eslint: setup in your editor https://eslint.org/ (or you can run
npm run eslint
)
-
Fork the project
In order to work on your own version of the Deriv application, please fork the project to your own repo.
-
Clone using SSH
git clone [email protected]:your-github-username/deriv-com.git
-
Enter project directory
cd deriv-com
-
Install your dependencies:
npm ci
-
Add env variables:
Create two files
.env.development
and.env.production
inside your project root directory.Then check your lastpass you'll see a shared item named Deriv-com Env Variables copy the variables, they look like this:
And paste them into the files.
-
To start developing:
npm start
-
Open the source code and start editing!
Your site is now running at
http://localhost:8000
!Note: You'll also see a second link:
http://localhost:8000/___graphql
. This is a tool you can use to experiment with querying your data. Learn more about using this tool in the Gatsby tutorial.
We have two types of PR (Pull request):
PR will be based on the master branch if the commits are not having text changes
-
Create branch from the latest master branch
git checkout master git pull upstream master git checkout -b [_your_branch_name]
-
Make your changes
-
Make pull request
-
Push your changes to your origin , add
-u
flag for the first time pushgit push -u origin [_your_branch_name]
-
Click on the autogenerated link from the terminal to open the PR
-
Make sure to change the PR base to
master
branch
PR will be based on crowdin branch if the commits are having text changes
- Create branch from latest crowdin branch
-
if you don't have crowdin branch
git fetch upstream crowdin:crowdin git checkout crowdin git checkout -b [_your_branch_name]
-
if you have crowdin branch
git checkout crowdin git pull upstream crowdin git checkout -b [_your_branch_name]
- Make your changes
- Commit your changes
- Make pull request
-
Push your changes to your origin, add
-u
flag for the first time pushgit push -u origin [_your_branch_name]
-
Click on the autogenerated link from terminal to open the PR
-
Make sure to change the PR base to
crowdin
branch
-
Pre-requisite:
-
Install crowdin-cli
brew tap crowdin/crowdin brew install crowdin
-
Set up your Crowdin API KEY in your .bash_profile or .zshrc
-
- Extract translation
-
Make sure you have the latest Crowdin changes, resolve conflicts if any
git pull upstream crowdin
-
Extract translation text to update
messages.json
npm run translate:extract
- Upload translation
-
To upload source text to Crowdin (When task merge to crowdin branch)
npm run translate:upload
- Download translation
-
To download/get the latest Crowdin translations
npm run translate:download
Note: Don't forget to create a pull request to update crowdin branch
There are 2 types of releases:
- Release to staging:
Merging to master (squash and merge) will automatically release the last commit to the staging server https://staging.deriv.com
- Release to production:
Releasing to production requires a tag using the following format:
production_VYYYYMMDD_${Integer}
--- Integer is the release version
Example of release steps
-
Create the tag following today's date
git tag production_V20200806_0 -m 'release to production'
-
Push the tag to the main repository
git push upstream production_V20200806_0
There are two types of test link deployment preview:
- Automatic deployment
Upon creating PR, Vercel will auto-generate a test link inside the PR. you can use that to preview the test link for the changes you have made.
- Manual deployment
If preferable to use manual deployment, you can use gh-pages functionality to create a test link. here are ways to do it:
-
Basic name.github.io/deriv-com/
npm run deploy-dev
⚠️ This will remove your branch deployments -
To a specific branch:
branch_name=fix_all_the_bugs npm run deploy-branch
This will be deployed to name.github.io/deriv-com/br/fix_all_the_bugs
- how to create a new page?
- how to insert an image?
- how to style my element?
- Where to put my new component?