Do a search within codebase for jsyang
for major / notable additions.
- Removed NavbarLeft
- Renamed "Selected for Development" to "Ready for Development"
- Added tooltips for date texts throughout app
- Removed AboutTooltip in favor of custom link to launch project
- Removed Breadcrumbs from Board and Settings
- Changed title from "Jira Clone" to "Project Tracker"
- Added SHORTKEY + ENTER as a KB hotkey for any textarea / rich text component
- Added ENTER autoFocused button for ConfirmModal
- Assume UTC for time display (e.g. XXX hours ago) due to SQLite not having a native DATETIME column type
- expose
privilegeLevel
from currentUser hook privilegeLevel
0 is not allowed- access to project settings
- to set reporter as anyone other than themselves
- Allow users to Login and Logout from SideBar
- Added Login modal content
- Secure client with HTTP basic auth when
NODE_ENV=production
- Add Quill editor image uploader
- Remove Atlassian link from 404 page and change the wallpaper
- Added Quill editor Markdown shortcuts so that descriptions can be easily formatted via KB
- Added Quill auto-linkify typed / pasted URLs
- Added
timeSpent
andestimate
to the partial issue response - Removed the Test API and underlying
createTestAccount.ts
logic
- use SQLite instead of PostgreSQL to remove a remote dependency
- added
privilegeLevel
to User (lower is less power) - added AVATAR_URL_UNKNOWN for Guest user
- ensure issue search works for SQLite
- added a new
NotPermittedError
- privilegeLevel 0 is not allowed to
- update issues, projects
- delete comments
- prevent users from deleting comments from other users
- added
/authentication/login
- added
password
to User (just plaintext is enough, not super critical to hash) - removed Comment, Issue seeds for DB
- ensure DB is only seeded if no Project / User tables have no rows
- ensure Users table is seeded in correct order
- ensure pm2 for client doesn't start pointing to
jira_clone
demo API server! - Add
skytrak2.conf
fornginx.conf
addition - add
process.env.ROOT_PATH
to allow all API routes to be rewritten as sub-paths under it- e.g. if ROOT_PATH is
/api
, then you'll get/api/authentication/guest
, etc.
- e.g. if ROOT_PATH is
- Add
/images/upload
to handle single image uploads for the Quill editor - Sort lists in the project board by:
- priority
- time estimate (total time estimate)
- time remaining (time remaining)
- Slack integration: comment / issue / project updates now trigger slack channel messages
- Search for
path.to.frontend
for any configuration settings that will need to be replaced if hosting on custom domain
sudo /opt/bitnami/ctlscript.sh stop nginx
sudo /opt/bitnami/letsencrypt/lego --tls --email="jim@completed.delivery" --domains="skytrak2.completed.delivery" --path="/opt/bitnami/letsencrypt" run
sudo mv /opt/bitnami/nginx/conf/server.crt /opt/bitnami/nginx/conf/server.crt.old
sudo mv /opt/bitnami/nginx/conf/server.key /opt/bitnami/nginx/conf/server.key.old
sudo mv /opt/bitnami/nginx/conf/server.csr /opt/bitnami/nginx/conf/server.csr.old
sudo ln -sf /opt/bitnami/letsencrypt/certificates/skytrak2.completed.delivery.key /opt/bitnami/nginx/conf/server.key
sudo ln -sf /opt/bitnami/letsencrypt/certificates/skytrak2.completed.delivery.crt /opt/bitnami/nginx/conf/server.crt
sudo chown root:root /opt/bitnami/nginx/conf/server*
sudo chmod 600 /opt/bitnami/nginx/conf/server*
sudo /opt/bitnami/ctlscript.sh start nginx
git pull
cd ~/jira_clone_custom/api
npm i
npm run build
pm2 delete jira_api
npm run start:production
cd ~/jira_clone_custom/api
npm i
npm run build
pm2 delete jira_client
npm run start:production
Slack API page, add these Bot Token Scopes:
- channels:join
- chat:write
- chat:write.customize
Then generate a "Bot User OAuth Access Token" and copy it, save it to the API .env
under SLACK_WEB_API_TOKEN
.
Set the channel the app will post in via SLACK_CHANNEL
.
Set the hosted app origin URL via CLIENT_URL
.
I do React consulting and this is a showcase product I've built in my spare time. It's a very good example of modern, real-world React codebase.
There are many showcase/example React projects out there but most of them are way too simple. I like to think that this codebase contains enough complexity to offer valuable insights to React developers of all skill levels while still being relatively easy to understand.
- Proven, scalable, and easy to understand project structure
- Written in modern React, only functional components with hooks
- A variety of custom light-weight UI components such as datepicker, modal, various form elements etc
- Simple local React state management, without redux, mobx, or similar
- Custom webpack setup, without create-react-app or similar
- Client written in Babel powered JavaScript
- API written in TypeScript and using TypeORM
- Install postgreSQL if you don't have it already and create a database named
jira_development
. git clone https://github.com/oldboyxx/jira_clone.git
- Create an empty
.env
file in/api
, copy/api/.env.example
contents into it, and fill in your database username and password. npm run install-dependencies
cd api && npm start
cd client && npm start
in another terminal tab- App should now be running on
http://localhost:8080/
- Set up development environment
- Create a database named
jira_test
and start the api withcd api && npm run start:test
cd client && npm run test:cypress
There are features missing from this showcase product which should exist in a real product:
We're currently using TypeORM's synchronize
feature which auto creates the database schema on every application launch. It's fine to do this in a showcase product or during early development while the product is not used by anyone, but before going live with a real product, we should introduce migrations.
We currently auto create an auth token and seed a project with issues and users for anyone who visits the API without valid credentials. In a real product we'd want to implement a proper email and password authentication system.
Not all components have properly defined aria attributes, visual focus indicators etc. Most early stage companies tend to ignore this aspect of their product but in many cases they shouldn't, especially once their userbase starts growing.
Both Client and API are currently tested through end-to-end Cypress tests. That's good enough for a relatively simple application such as this, even if it was a real product. However, as the app grows in complexity, it might be wise to start writing additional unit/integration tests.
- Website: https://getivor.com/
- Skype handle: ivor.reic π¬
I will not be accepting PR's on this repository. Feel free to fork and maintain your own version.