This project powers the virtual Cheetah Museum at https://hope4cheetahs.org.
Named after the iconic cheetah ambassador Chewbaaka, this project is dedicated to Cheetah Conservation Fund and to showcase CCF's Cheetah Museum virtually at https://hope4cheetahs.org. The goal is to promote cheetah conservation and get more people to learn about the amazing cheetahs and their current plight.
Click here to view CCF's official video tour of the Cheetah Museum.
Anybody interested in this project is encouraged to contribute in any ways possible. Currently contributions are mostly needed in these areas:
Help in improving the core functionalities and performance of the site is always welcomed and highly needed.
-
Site performance improvements in various aspects including but not limiting to site launch and rendering performance, payload optimizations, graphics and image assets optimizations and compressions. Google Lighthouse is the de-facto performance metrics tool used so far to determine perf improvement opportunities.
-
Design and implement more interactive elements. This site was designed to simulate the experience of visiting the actual museum as close as possible. There are a lot more that could be done to refine the experience to be more interactive and engaging. Ideas, designs, and implementations in this area are highly needed and valued.
SEO has been an aspect that is currently lacking in this project. Contributions from folks that are experts in SEO are very much needed at the moment.
Simply help spread the word out about the current plight of the cheetahs to your family and friends is a great way to help.
You can read about CCF's work in stopping illegal cheetah trades and trafficking in eastern Africa and the Persian Gulf on CCF's official site here, and the latest update from here.
CNN Exclusive: The ultra-rich are illegally buying cheetahs as pets and it's leading to their extinction
Visit Cheetah Conservation Fund's official site at https://cheetah.org/ to learn about many ways people can contribute, including donations, fundraising campaigns, internship and volunteering opportunities (both domestically and overseas).
First, thank you for your interest! The first step would be to read down below to get familiar with the workflow and build steps of this project.
For opening up discussions on ideas and questions, opening up an issue here is the best way.
For other changes, please open up a Pull Request.
Currently, there are only two major branches - master and release.
The master branch is served to hold the most active development work. TOT of this branch should hold the latest work merged from feature branch approved Pull Requests.
All work need to be done on a feature branch branched off from the master branch, and have a Pull Request open once ready to be reviewed and have CI jobs kick in. All feature branches will merge back to the master branch once approved and have green status across all required CI jobs.
The release branch should ALWAYS holds the latest stable release version, as any updates to the release branch is automatically deployed to the server. Only merging of version git tags authored on master to the release branch is allowed.
Both pull requests and commit messages should document the relevant changes with concise descriptions.
The project requires Node.js and npm to be installed.
Node.js version 14.x is the recommended version for development.
Node.js install should automatically installs the npm package manager.
Node.js official link here.
(Currently I have Node.js version v14.17.4 (check with node --version) installed for development,
which also installs npm version 6.14.14 (check with npm --version)).
Once the repo is cloned, the first thing is to setup the necessary environment and all dependencies. Run the following in the terminal.
npm ci
Building the development version of the project while developing is the most recommended practice, as all changes are instantaneously reflected through the Node.js "server". To build and run the project, do
npm start
If you are able to build the project successfully, you should see the following in the terminal:
Compiled successfully!
You can now view chewbaaka in the browser.
Local: http://localhost:3000
On Your Network: http://192.168.0.14:3000
Note that the development build is not optimized.
To create a production build, use npm run build.
Simply go to http://localhost:3000 in the web browser to view the rendered site. Any changes in source code that result in successful builds will automatically be reflected in the browser.
Writing and exercising unit tests frequently is a good practice in React development. To run the test suite, run:
npm test
Test files should have the same naming convention of their corresponding
.js files, except with the .test.js file extension, and be placed
in the __tests__ directory. For example, if the component file is
named MyComponent.js, then the test file should be named MyComponent.test.js.
There are currently two types of tests -
- Jest-based tests
- Snapshot tests
Snapshot files (with .snap extension) should be updated to be correct
and be checked-in in the corresponding __snapshots__ directory as
part of the repository source artifact.
To generate release build for production, run:
npm run build
This will generate the entire site in production/release mode.
The output will be under the local build/ directory.
To serve the production build locally, one can use the serve
package, which can be installed with:
npm install -g serve
Once serve has been installed, it can be used to serve the production
release locally with:
serve -s build -l 3000
This will prompt serve to launch a virtual server that serves
the production build at localhost port 3000.
Once the production build can be served locally, one can make use of Google Lighthouse's CLI tool to audit the production build locally.
First, to install the Node command line tool for Google Lighthouse, follow the instructions here and run:
npm install -g lighthouse
Once it's installed, build and serve the production build like described above, and while the virtual server is running, invoke Lighthouse like below:
For home page:
lighthouse http://localhost:3000 --view
Or for a particular content page:
lighthouse http://localhost:3000/<page> --view
This will invoke Lighthouse to audit the page, and at the end of the audit automatically open up the report page.
Release note can be found here.
All documentations are hosted on the project's wiki.
This project is licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International Public License.
This project is not affiliated with Cheetah Conservation Fund.