├── community └── log.md ├── mentorship └── log.md ├── submission ├── log.md ├── Design │ └── log.md └── development │ ├── backend │ ├── example_user │ │ └── readme.md │ └── example_user1 │ │ └── readme.md │ └── frontend │ ├── example_user │ ├── readme.md │ └── newcomer │ │ └── readme.md │ ├── Andina │ └── Newcomer │ │ └── readme.md │ ├── nain │ └── newcomer │ │ ├── 01 │ │ └── readme.md │ │ └── 02 │ │ └── readme.md │ ├── Wenno │ └── newcomer │ │ └── 01 │ │ └── readme.md │ ├── chen │ └── newcomer │ │ ├── js-interaction-3.md │ │ ├── css-layout-2.md │ │ └── chen-html-intro │ │ └── indexhhtml.md │ ├── Mayrli │ └── newcomer │ │ └── chapter 1 │ │ └── indeks.html │ └── Felicitaz Grace Realita │ └── newcomer │ ├── main2.css │ └── index.html ├── exercises ├── gamedev │ └── log.md ├── cybersecurity │ └── log.md ├── design │ ├── uiux │ │ ├── 01-newcomer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 04-innovator │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ ├── 01 │ │ │ │ ├── log.md │ │ │ │ └── fundamental.md │ │ │ ├── 02 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 03 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 04 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ ├── 01 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 02 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 03 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 04 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ └── readme.md │ │ └── readme.md │ ├── graphic-design │ │ ├── 01-newcomer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 04-innovator │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ └── readme.md │ ├── product-design │ │ ├── 01-newcomer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ └── 04-innovator │ │ │ ├── 01 │ │ │ └── log.md │ │ │ ├── 02 │ │ │ └── log.md │ │ │ ├── 03 │ │ │ └── log.md │ │ │ ├── 04 │ │ │ └── log.md │ │ │ └── readme.md │ └── user-research │ │ ├── 01-newcomer │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ ├── 03-builder │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ ├── 04-innovator │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ ├── 01-newcomer copy │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ └── readme.md ├── development │ ├── backend │ │ ├── 01-newcomer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ └── 04 │ │ │ │ └── log.md │ │ ├── 02-explorer │ │ │ ├── 01 │ │ │ │ ├── log.md │ │ │ │ └── readme.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ └── 04 │ │ │ │ └── log.md │ │ ├── 04-innovator │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ └── 03-builder │ │ │ ├── 01 │ │ │ └── log.md │ │ │ ├── 02 │ │ │ ├── log.md │ │ │ └── fundamental.md │ │ │ ├── 03 │ │ │ ├── log.md │ │ │ └── fundamental.md │ │ │ └── 04 │ │ │ ├── log.md │ │ │ └── fundamental.md │ ├── frontend │ │ ├── 02-explorer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ └── 04 │ │ │ │ └── log.md │ │ ├── 04-innovator │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ ├── 01 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 02 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ ├── 03 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ │ └── 04 │ │ │ │ ├── log.md │ │ │ │ ├── fundamental.md │ │ │ │ └── README.md │ │ └── 01-newcomer │ │ │ └── readme.md │ ├── fullstack │ │ ├── 01-newcomer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ ├── 04-innovator │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── 02 │ │ │ │ └── log.md │ │ │ ├── 03 │ │ │ │ └── log.md │ │ │ ├── 04 │ │ │ │ └── log.md │ │ │ └── readme.md │ │ └── readme.md │ └── mobile │ │ ├── 01-newcomer │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ ├── 02-explorer │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ ├── 03-builder │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ ├── 04-innovator │ │ ├── 01 │ │ │ └── log.md │ │ ├── 02 │ │ │ └── log.md │ │ ├── 03 │ │ │ └── log.md │ │ ├── 04 │ │ │ └── log.md │ │ └── readme.md │ │ └── readme.md ├── data │ ├── analytics │ │ ├── 01-newcomer │ │ │ ├── 01 │ │ │ │ └── log.md │ │ │ ├── readme.md │ │ │ └── 03 │ │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ └── readme.md │ │ ├── 04-innovator │ │ │ └── readme.md │ │ └── 02-explorer │ │ │ └── readme.md │ ├── machine-learning │ │ └── 01-newcomer │ │ │ └── readme.md │ ├── data-science │ │ └── 01-newcomer │ │ │ └── readme.md │ └── business-intelligence │ │ └── 01-newcomer │ │ └── readme.md ├── business │ ├── project-management │ │ ├── 01-newcomer │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ └── readme.md │ │ ├── 04-innovator │ │ │ └── readme.md │ │ └── 03-builder │ │ │ └── readme.md │ ├── product-management │ │ ├── 01-newcomer │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ └── readme.md │ │ └── 04-innovator │ │ │ └── readme.md │ ├── strategy │ │ ├── 01-newcomer │ │ │ └── readme.md │ │ ├── 02-explorer │ │ │ └── readme.md │ │ ├── 04-innovator │ │ │ └── readme.md │ │ ├── 03-builder │ │ │ └── readme.md │ │ └── readme.md │ └── business-analysis │ │ ├── 03-builder │ │ └── readme.md │ │ ├── 01-newcomer │ │ └── readme.md │ │ ├── 02-explorer │ │ └── readme.md │ │ └── 04-innovator │ │ └── readme.md └── operations │ ├── qa-testing │ └── readme.md │ ├── infrastructure │ └── readme.md │ ├── security │ └── readme.md │ └── devops │ └── readme.md ├── resources ├── learn-something-fundamental │ ├── general-topics │ │ ├── algorithms │ │ │ ├── fundamental.md │ │ │ └── readme.md │ │ ├── variables │ │ │ └── readme.md │ │ ├── error-handling │ │ │ └── readme.md │ │ ├── functions │ │ │ └── readme.md │ │ ├── objects │ │ │ └── readme.md │ │ ├── control-flow │ │ │ └── readme.md │ │ ├── arrays │ │ │ └── readme.md │ │ ├── async-programming │ │ │ └── readme.md │ │ ├── data-structures │ │ │ ├── readme.md │ │ │ └── fundamental.md │ │ └── readme.md │ ├── library-and-framework │ │ ├── react │ │ │ ├── readme.md │ │ │ └── fundamental.md │ │ └── readme.md │ ├── programming-language │ │ ├── html │ │ │ ├── readme.md │ │ │ └── fundamental.md │ │ └── readme.md │ └── readme.md └── tool-and-setup │ ├── figma.md │ ├── business_tools.md │ ├── node_npm.md │ └── ml_setup.md ├── code_of_conduct.md └── templates └── review-templete.md /community/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /mentorship/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /submission/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/gamedev/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /submission/Design/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/cybersecurity/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/backend/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/frontend/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/01-newcomer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/01-newcomer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/01-newcomer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/mobile/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /submission/development/backend/example_user/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/product-design/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/01/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/02/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/03/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/04/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer copy/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer copy/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer copy/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer copy/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/design/user-research/01-newcomer copy/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/04-innovator/01/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/04-innovator/02/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/04-innovator/03/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /exercises/development/fullstack/04-innovator/04/log.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /submission/development/frontend/example_user/readme.md: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /submission/development/backend/example_user1/readme.md: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/01/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/02/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/03/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/04/log.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | -------------------------------------------------------------------------------- /submission/development/frontend/example_user/newcomer/readme.md: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /submission/development/frontend/Andina/Newcomer/readme.md: -------------------------------------------------------------------------------- 1 | 16 juli 2025 2 | dl 19 juli 2025 3 | 4 | link repo tgs 5 | -------------------------------------------------------------------------------- /submission/development/frontend/nain/newcomer/01/readme.md: -------------------------------------------------------------------------------- 1 | TUGAS 01 2 | 3 | 16 JULI 2025 4 | 5 | LINK TUGAS() 6 | -------------------------------------------------------------------------------- /submission/development/frontend/Wenno/newcomer/01/readme.md: -------------------------------------------------------------------------------- 1 | Tugas Saya 2 | -------------------------------------------------------------------------------- /submission/development/frontend/chen/newcomer/js-interaction-3.md: -------------------------------------------------------------------------------- 1 | [exercise 3 chen](https://github.com/dearest-chen/ex3-frontend-newcomer.github.io) 2 | -------------------------------------------------------------------------------- /submission/development/frontend/chen/newcomer/css-layout-2.md: -------------------------------------------------------------------------------- 1 | [exercise 2 punya chen](https://github.com/dearest-chen/ex2-frontend-newcomer.github.io) 2 | -------------------------------------------------------------------------------- /submission/development/frontend/chen/newcomer/chen-html-intro/indexhhtml.md: -------------------------------------------------------------------------------- 1 | 14 Juli 2025 - 17 Juli 2025 2 | 3 | 4 | [link exercise 1](https://github.com/dearest-chen/index.html.git) 5 | -------------------------------------------------------------------------------- /submission/development/frontend/nain/newcomer/02/readme.md: -------------------------------------------------------------------------------- 1 | TUGAS 02 2 | 3 | 17 JULI 2025 4 | 5 | [LINK TUGAS](https://github.com/dzenmori/PL-submited-frontend-newcomer-Nain/tree/main/02) 6 | -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/algorithms/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧮 Algorithms Fundamental 2 | 3 | ## 1. Apa itu Algoritma? 4 | > Penjelasan singkat tentang algoritma dan perannya di pemrograman. 5 | 6 | ## 2. Flowchart & Pseudocode 7 | - Penjelasan, contoh sederhana. 8 | 9 | ## 3. Algoritma Dasar 10 | - Sorting (bubble sort, selection sort) 11 | - Searching (linear, binary search) 12 | 13 | ## 4. Analisis Kompleksitas 14 | - Konsep O(n), O(1), dst. 15 | 16 | > Lengkapi setiap bagian dengan penjelasan dan contoh sesuai kebutuhan. -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/variables/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Variables 2 | 3 | Materi pembelajaran variabel — konsep dasar penyimpanan data dalam pemrograman. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan variabel dan tipe data 7 | 2. Deklarasi dan assignment 8 | 3. Scope dan lifetime 9 | 4. Best practices dan naming conventions 10 | 11 | ## 📂 Isi Materi 12 | - fundamental.md 13 | - tips.md 14 | - latihan-soal.md 15 | - advanced.md 16 | 17 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/library-and-framework/react/readme.md: -------------------------------------------------------------------------------- 1 | # ⚛️ React 2 | 3 | Materi pembelajaran React — library JavaScript untuk membangun UI modern. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan React & konsep komponen 7 | 2. JSX, props, state 8 | 3. Event handling & lifecycle 9 | 4. Hooks & context 10 | 5. Studi kasus & latihan 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/algorithms/readme.md: -------------------------------------------------------------------------------- 1 | # 🧮 Algorithms 2 | 3 | Materi pembelajaran algoritma — dasar logika dan pemecahan masalah di dunia pemrograman. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan algoritma & flowchart 7 | 2. Algoritma dasar (sorting, searching) 8 | 3. Analisis kompleksitas 9 | 4. Studi kasus & latihan 10 | 11 | ## 📂 Isi Materi 12 | - fundamental.md 13 | - tips.md 14 | - latihan-soal.md 15 | - advanced.md 16 | 17 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/error-handling/readme.md: -------------------------------------------------------------------------------- 1 | # ⚠️ Error Handling 2 | 3 | Materi pembelajaran error handling — cara menangani dan mengelola error dalam program. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan error dan debugging 7 | 2. Try-catch statements 8 | 3. Error types dan custom errors 9 | 4. Best practices error handling 10 | 5. Debugging techniques 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/library-and-framework/react/fundamental.md: -------------------------------------------------------------------------------- 1 | # ⚛️ React Fundamental 2 | 3 | ## 1. Apa itu React? 4 | > Penjelasan singkat tentang React dan kegunaannya. 5 | 6 | ## 2. Konsep Komponen 7 | - Penjelasan komponen, contoh komponen sederhana. 8 | 9 | ## 3. JSX 10 | - Apa itu JSX, contoh sintaks dasar. 11 | 12 | ## 4. Props & State 13 | - Penjelasan props dan state, contoh penggunaan. 14 | 15 | ## 5. Render & Event Handling 16 | - Cara render komponen, event dasar (onClick, dsb). 17 | 18 | > Lengkapi setiap bagian dengan penjelasan dan contoh sesuai kebutuhan. -------------------------------------------------------------------------------- /resources/learn-something-fundamental/programming-language/html/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 HTML 2 | 3 | Dasar-dasar dan materi lanjutan tentang HTML (HyperText Markup Language) — fondasi utama web development. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan HTML & struktur dokumen 7 | 2. Tag dasar & atribut 8 | 3. Form, tabel, media 9 | 4. Best practice & aksesibilitas 10 | 5. Studi kasus & latihan 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/functions/readme.md: -------------------------------------------------------------------------------- 1 | # ⚙️ Functions 2 | 3 | Materi pembelajaran fungsi — blok kode yang dapat dipanggil dan digunakan kembali. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan fungsi dan kegunaannya 7 | 2. Deklarasi dan pemanggilan fungsi 8 | 3. Parameter dan return value 9 | 4. Function types dan scope 10 | 5. Callback dan higher-order functions 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/objects/readme.md: -------------------------------------------------------------------------------- 1 | # 🎯 Objects 2 | 3 | Materi pembelajaran object — struktur data untuk menyimpan data dalam format key-value pairs. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan object dan kegunaannya 7 | 2. Membuat dan mengakses object 8 | 3. Object methods dan properties 9 | 4. Object destructuring 10 | 5. Object-oriented programming basics 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/control-flow/readme.md: -------------------------------------------------------------------------------- 1 | # 🔄 Control Flow 2 | 3 | Materi pembelajaran control flow — cara mengontrol alur eksekusi program berdasarkan kondisi. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan control flow dan kondisional 7 | 2. If, else if, else statements 8 | 3. Switch case statements 9 | 4. Loops (for, while, do-while) 10 | 5. Break dan continue statements 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/arrays/readme.md: -------------------------------------------------------------------------------- 1 | # 📋 Arrays 2 | 3 | Materi pembelajaran array — struktur data untuk menyimpan kumpulan nilai dalam satu variabel. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan array dan kegunaannya 7 | 2. Membuat dan mengakses array 8 | 3. Array methods (push, pop, shift, unshift) 9 | 4. Array iteration (for, forEach, map, filter) 10 | 5. Multi-dimensional arrays 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/async-programming/readme.md: -------------------------------------------------------------------------------- 1 | # ⏱️ Async Programming 2 | 3 | Materi pembelajaran asynchronous programming — cara menangani operasi yang membutuhkan waktu. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan synchronous vs asynchronous 7 | 2. Callbacks dan callback hell 8 | 3. Promises dan async/await 9 | 4. Event loop dan concurrency 10 | 5. Best practices async programming 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/programming-language/readme.md: -------------------------------------------------------------------------------- 1 | # 📝 Programming Language 2 | 3 | Materi pembelajaran berbagai bahasa pemrograman — dari dasar hingga lanjutan. Setiap bahasa memiliki folder sendiri yang berisi: 4 | - **fundamental.md**: Konsep dasar, sintaks, dan contoh kode 5 | - **tips.md**: Tips belajar, best practice, sumber belajar 6 | - **latihan-soal.md**: Soal latihan dan challenge 7 | - **advanced.md**: Materi lanjutan dan studi kasus 8 | 9 | ## 📋 Daftar Bahasa (contoh) 10 | - HTML 11 | - CSS 12 | - JavaScript 13 | - Java 14 | - Python 15 | - ... 16 | 17 | > Silakan tambah bahasa lain sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/library-and-framework/readme.md: -------------------------------------------------------------------------------- 1 | # 🏗️ Library & Framework 2 | 3 | Materi pembelajaran berbagai library dan framework populer di dunia teknologi. Setiap topik memiliki folder sendiri yang berisi: 4 | - **fundamental.md**: Konsep dasar, instalasi, dan contoh penggunaan 5 | - **tips.md**: Tips belajar, best practice, sumber belajar 6 | - **latihan-soal.md**: Soal latihan dan challenge 7 | - **advanced.md**: Materi lanjutan dan studi kasus 8 | 9 | ## 📋 Daftar Library/Framework (contoh) 10 | - React 11 | - Tailwind 12 | - Node.js 13 | - Vite 14 | - ... 15 | 16 | > Silakan tambah library/framework lain sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/data-structures/readme.md: -------------------------------------------------------------------------------- 1 | # 🏗️ Data Structures 2 | 3 | Materi pembelajaran data structures — cara menyimpan dan mengorganisir data secara efisien. 4 | 5 | ## 🚩 Roadmap Belajar 6 | 1. Pengenalan data structures dan kegunaannya 7 | 2. Basic data structures (array, object, set, map) 8 | 3. Advanced data structures (stack, queue, linked list) 9 | 4. Tree dan graph basics 10 | 5. Algorithm complexity analysis 11 | 12 | ## 📂 Isi Materi 13 | - fundamental.md 14 | - tips.md 15 | - latihan-soal.md 16 | - advanced.md 17 | 18 | > Mulai dari fundamental, lanjutkan ke tips, latihan, dan materi lanjutan sesuai kebutuhan! -------------------------------------------------------------------------------- /resources/learn-something-fundamental/programming-language/html/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🌐 HTML Fundamental 2 | 3 | ## 1. Apa itu HTML? 4 | > Penjelasan singkat tentang HTML dan fungsinya. 5 | 6 | ## 2. Struktur Dasar Dokumen HTML 7 | ```html 8 | 9 | 10 | 11 | Judul Halaman 12 | 13 | 14 |

Halo Dunia!

15 | 16 | 17 | ``` 18 | 19 | ## 3. Tag & Atribut Dasar 20 | - `

`, `

`, ``, ``, `

`, dst. 21 | - Penjelasan dan contoh penggunaan. 22 | 23 | ## 4. Form, Tabel, dan Media 24 | - Formulir input, tabel data, gambar, video. 25 | 26 | ## 5. Best Practice 27 | - Struktur rapi, semantik, aksesibilitas. 28 | 29 | > Lengkapi setiap bagian dengan penjelasan dan contoh sesuai kebutuhan. -------------------------------------------------------------------------------- /submission/development/frontend/Mayrli/newcomer/chapter 1/indeks.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | MARSHINTAULI MAYRLIWANI #1 6 | 7 | 8 | 9 |

Marshintauli Mayrliwani Br. Tambun

10 |

Hi, nama aku Marshintauli Mayrliwani Br. Tambun, bisanya dipanggil Mayrli atau May. Aku Mahasiswa Baru Universitas Lampung dengan prodi Teknik Informatika.

11 |

Aku memiliki beberapa hobi yang sering aku lakukan, yaitu:

12 | 13 |
    14 |
  • Bermain Musik
    • 15 |
16 | Bermain Musik 17 |
    18 |
  • Membaca Buku
    • 19 |
20 | Membaca Buku 21 |
    22 |
  • Main Roblox :D
    • 23 |
24 | Main Roblox :D 25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/02/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🏗️ FUNDAMENTAL – Design System & Style Guide 2 | 3 | Design system dan style guide adalah alat utama untuk menjaga konsistensi, efisiensi, dan kolaborasi dalam tim desain dan developer. 4 | 5 | --- 6 | 7 | ## 🧩 Apa Itu Design System? 8 | 9 | - **Design system**: Kumpulan aturan, komponen, dan dokumentasi visual yang menjadi acuan seluruh tim 10 | - Berisi: style guide, komponen UI, aturan penggunaan, dokumentasi 11 | 12 | --- 13 | 14 | ## 🎨 Apa Itu Style Guide? 15 | 16 | - **Style guide**: Panduan visual (warna, font, spacing, ikon, dsb.) 17 | - Menjadi dasar pembuatan komponen dan layout 18 | 19 | --- 20 | 21 | ## 💡 Manfaat Design System 22 | - Konsistensi visual di seluruh produk 23 | - Mempercepat proses desain dan dev 24 | - Memudahkan onboarding anggota baru 25 | - Mengurangi duplikasi dan error 26 | 27 | --- 28 | 29 | ## 🔗 Referensi 30 | - [Design Systems Repo](https://designsystemsrepo.com/) 31 | - [Material Design – Design System](https://m3.material.io/foundations/design-system/overview) 32 | - [Zeroheight](https://zeroheight.com/) 33 | 34 | --- 35 | 36 | > "Design system bukan sekadar kumpulan komponen, tapi budaya kolaborasi dan kualitas produk." -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/04/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🏗️ FUNDAMENTAL – Handoff & Developer Spec 2 | 3 | Handoff adalah proses penting dalam workflow desain: memastikan desain bisa diimplementasikan dev dengan akurat dan efisien. 4 | 5 | --- 6 | 7 | ## 🔄 Apa Itu Handoff? 8 | 9 | - **Handoff**: Proses menyerahkan desain final ke developer, lengkap dengan spec, asset, dan dokumentasi 10 | - Tujuan: meminimalisir miskomunikasi dan error implementasi 11 | 12 | --- 13 | 14 | ## 📐 Developer Spec 15 | 16 | - **Spec**: Detail teknis desain (spacing, warna, font, ukuran, dsb.) 17 | - Tools: Figma Inspect, Zeplin, Notion 18 | - Export asset: ikon, gambar, ilustrasi 19 | 20 | --- 21 | 22 | ## 💡 Tips Praktis 23 | - Dokumentasikan semua aturan dan asset penting 24 | - Kolaborasi aktif: review implementasi, feedback dua arah 25 | - Checklist implementasi untuk dev 26 | 27 | --- 28 | 29 | ## 🔗 Referensi 30 | - [Figma – Handoff](https://help.figma.com/hc/en-us/articles/360040451373-Developer-handoff-in-Figma) 31 | - [Zeplin](https://zeplin.io/) 32 | - [Material Design – Developer Guide](https://m3.material.io/develop/overview) 33 | 34 | --- 35 | 36 | > "Handoff yang baik = produk yang sesuai visi desain dan mudah diimplementasikan dev." -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/data-structures/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🏗️ Data Structures Fundamental 2 | 3 | ## 1. Apa itu Data Structure? 4 | > Penjelasan singkat tentang data structure dan mengapa penting dalam programming. 5 | 6 | ## 2. Basic Data Structures 7 | - Array (ordered collection) 8 | - Object (key-value pairs) 9 | - Set (unique values) 10 | - Map (key-value with any type) 11 | 12 | ## 3. Linear Data Structures 13 | - Stack (LIFO - Last In First Out) 14 | - Queue (FIFO - First In First Out) 15 | - Linked List (connected nodes) 16 | - Array List vs Linked List 17 | 18 | ## 4. Tree Structures 19 | - Binary Tree 20 | - Binary Search Tree 21 | - Tree traversal (inorder, preorder, postorder) 22 | - Tree balancing 23 | 24 | ## 5. Graph Basics 25 | - Vertices dan edges 26 | - Directed vs undirected graphs 27 | - Graph representation 28 | - Graph traversal (DFS, BFS) 29 | 30 | ## 6. Hash Tables 31 | - Hash function 32 | - Collision resolution 33 | - Load factor 34 | - Time complexity 35 | 36 | ## 7. Algorithm Complexity 37 | - Time complexity (Big O notation) 38 | - Space complexity 39 | - Best, average, worst case 40 | - Algorithm efficiency 41 | 42 | > Lengkapi setiap bagian dengan penjelasan dan contoh sesuai kebutuhan. -------------------------------------------------------------------------------- /submission/development/frontend/Felicitaz Grace Realita/newcomer/main2.css: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: sans-serif; 3 | } 4 | .pict-element{ 5 | display: flex; 6 | background-color: #fba5ea; 7 | 8 | } 9 | .pict-element div{ 10 | background-color: rgb(114, 187, 235); 11 | margin: 10px; 12 | padding: 20px; 13 | font-size: 20px; 14 | } 15 | 16 | 17 | h1 { 18 | text-align: center; 19 | color:rgb(114, 187, 235) 20 | } 21 | h2 { 22 | text-align: center; 23 | } 24 | p { 25 | text-align: justify; 26 | size: 16px; 27 | max-width: 600px; 28 | margin: auto; 29 | } 30 | 31 | .pictured { 32 | text-align: justify; 33 | size: 16px; 34 | max-width: 600px; 35 | margin: auto; 36 | } 37 | .container{ 38 | display: flex; 39 | flex-direction: flex-start; 40 | gap: 20px; 41 | } 42 | .newlink { 43 | display: flex; 44 | gap: 20px; 45 | } 46 | .box { 47 | width: 120px; 48 | height: 60; 49 | font-size: 7em; 50 | text-align: center; 51 | } 52 | .light { 53 | background-color: pink; 54 | color: #000; 55 | } 56 | .dark .content { 57 | background-color: azure; 58 | } 59 | .dark .button { 60 | background-color: bisque; 61 | color: #eee; 62 | } 63 | #darkModeToggle { 64 | position: fixed; 65 | top: 10px; 66 | right: 10px; 67 | } 68 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/03/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧭 FUNDAMENTAL – User Persona & Interview 2 | 3 | User persona dan riset user adalah alat utama untuk memahami siapa pengguna utama produk dan apa kebutuhan/motivasi mereka. 4 | 5 | --- 6 | 7 | ## 👤 Apa Itu User Persona? 8 | 9 | - **Persona** adalah representasi fiktif dari user utama, dibuat berdasarkan data riset/interview 10 | - Berisi: nama, usia, pekerjaan, tujuan, pain point, motivasi 11 | - Persona membantu tim fokus pada kebutuhan nyata, bukan asumsi 12 | 13 | --- 14 | 15 | ## 📝 Riset User: Interview & Survey 16 | 17 | - Interview: Tanya jawab langsung untuk menggali insight mendalam 18 | - Survey: Kuesioner online untuk data kuantitatif 19 | - Catat kebutuhan, motivasi, masalah, dan kebiasaan user 20 | 21 | --- 22 | 23 | ## 💡 Tips Praktis 24 | - Gunakan template persona (Figma, Google Docs) 25 | - Tanyakan pertanyaan terbuka, bukan hanya ya/tidak 26 | - Analisis pola dari beberapa user, bukan satu saja 27 | 28 | --- 29 | 30 | ## 🔗 Referensi 31 | - [NNG – Personas](https://www.nngroup.com/articles/persona/) 32 | - [Empathy Map – Atlassian](https://www.atlassian.com/team-playbook/plays/empathy-map) 33 | - [Google Forms](https://forms.google.com/) 34 | 35 | --- 36 | 37 | > "Desain yang berdampak lahir dari pemahaman mendalam tentang siapa user kita dan apa yang mereka butuhkan." -------------------------------------------------------------------------------- /exercises/data/analytics/01-newcomer/01/log.md: -------------------------------------------------------------------------------- 1 | # 📝 Exercise Log - Excel & Statistik Deskriptif 2 | 3 | **Track**: Data & Analytics 4 | **Level**: Newcomer 5 | **Exercise**: 01 6 | **Status**: Not Started 7 | 8 | --- 9 | 10 | ## 📋 Progress Checklist 11 | 12 | - [ ] Download dan review dataset 13 | - [ ] Hitung mean, median, mode 14 | - [ ] Hitung standard deviation dan variance 15 | - [ ] Hitung correlation 16 | - [ ] Buat tabel ringkasan 17 | - [ ] Tulis interpretasi dan insight 18 | - [ ] Submit hasil 19 | 20 | --- 21 | 22 | ## 🗓️ Timeline 23 | 24 | | Tanggal | Aktivitas | Status | 25 | |---------|-----------|--------| 26 | | | | | 27 | | | | | 28 | | | | | 29 | 30 | --- 31 | 32 | ## 💭 Notes & Challenges 33 | 34 | ### Kesulitan yang Dihadapi 35 | - 36 | 37 | ### Insight yang Didapat 38 | - 39 | 40 | ### Tools yang Dipelajari 41 | - 42 | 43 | --- 44 | 45 | ## 📊 Results Summary 46 | 47 | ### Statistik Deskriptif 48 | - Mean: 49 | - Median: 50 | - Mode: 51 | - Standard Deviation: 52 | - Variance: 53 | 54 | ### Correlation 55 | - 56 | 57 | ### Insight Bisnis 58 | - 59 | 60 | --- 61 | 62 | ## 🔗 Resources Used 63 | 64 | - 65 | - 66 | - 67 | 68 | --- 69 | 70 | > "Setiap langkah dalam analisis data adalah pembelajaran. Catat prosesmu untuk referensi masa depan." -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/03/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🏗️ FUNDAMENTAL – Accessibility Audit & Fix 2 | 3 | Aksesibilitas adalah prinsip utama dalam desain digital: memastikan semua user, termasuk disabilitas, dapat menggunakan produk dengan nyaman. 4 | 5 | --- 6 | 7 | ## ♿ Apa Itu Accessibility (A11y)? 8 | 9 | - **Accessibility (A11y)**: Kemudahan akses produk digital untuk semua user, termasuk yang memiliki keterbatasan 10 | - Contoh: kontras warna cukup, navigasi keyboard, label jelas, dsb. 11 | 12 | --- 13 | 14 | ## 🔍 Audit Aksesibilitas 15 | 16 | - Audit: Proses menilai desain/prototype untuk menemukan masalah aksesibilitas 17 | - Tools: Stark, Contrast Checker, screen reader, dsb. 18 | 19 | --- 20 | 21 | ## 🛠️ Perbaikan (Fix) 22 | 23 | - Perbaiki masalah yang ditemukan: kontras, ukuran font, label, navigasi 24 | - Uji ulang dengan tools dan, jika bisa, user nyata 25 | 26 | --- 27 | 28 | ## 💡 Tips Praktis 29 | - Gunakan checklist aksesibilitas (WCAG, Material Design) 30 | - Uji desain dengan keyboard dan screen reader 31 | - Dokumentasikan perubahan dan temuan 32 | 33 | --- 34 | 35 | ## 🔗 Referensi 36 | - [Stark – Accessibility Tools](https://www.getstark.co/) 37 | - [Material Design – Accessibility](https://m3.material.io/foundations/accessibility/overview) 38 | - [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/) 39 | 40 | --- 41 | 42 | > "Desain inklusif = produk yang benar-benar bermanfaat untuk semua orang." -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/01/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🏗️ FUNDAMENTAL – Hi-Fi Design & Prototyping 2 | 3 | Hi-fi design dan prototyping adalah tahap lanjutan dalam proses desain digital, di mana ide dan wireframe diubah menjadi tampilan visual yang detail dan siap diuji. 4 | 5 | --- 6 | 7 | ## 🎨 Apa Itu Hi-Fi Design? 8 | 9 | - **Hi-fi (high fidelity) design**: Desain visual detail, mendekati produk akhir (warna, font, spacing, komponen nyata) 10 | - Berbeda dengan wireframe (low-fi) yang hanya kerangka 11 | 12 | --- 13 | 14 | ## 🖱️ Apa Itu Prototyping? 15 | 16 | - **Prototype**: Simulasi interaktif dari desain, bisa diklik/navigasi seperti aplikasi nyata 17 | - Digunakan untuk uji coba, presentasi, dan validasi ide 18 | 19 | --- 20 | 21 | ## 💡 Best Practice 22 | - Gunakan style guide/komponen konsisten 23 | - Buat prototype interaktif untuk flow utama (navigasi, CTA) 24 | - Presentasikan rationale desain: kenapa memilih warna, layout, dsb. 25 | - Uji prototype ke user/mentor untuk feedback 26 | 27 | --- 28 | 29 | ## 🔗 Referensi 30 | - [Figma – Hi-Fi Design](https://help.figma.com/hc/en-us/articles/360040451373-Create-high-fidelity-designs-in-Figma) 31 | - [Figma – Prototyping](https://help.figma.com/hc/en-us/articles/360040451373-Create-prototypes-in-Figma) 32 | - [Material Design – Components](https://m3.material.io/components) 33 | 34 | --- 35 | 36 | > "Desain hi-fi dan prototype adalah bukti nyata ide siap diuji dan dikembangkan, bukan sekadar gambar indah." -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/04/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧱 FUNDAMENTAL – Testing & Best Practice di Frontend 2 | 3 | Testing dan struktur project yang baik adalah kunci aplikasi frontend yang scalable dan minim bug. 4 | 5 | --- 6 | 7 | ## 🧪 Unit Testing Komponen 8 | 9 | - **Unit test**: Menguji satuan kecil kode (komponen, fungsi) 10 | - React Testing Library: Tool utama untuk test komponen React 11 | - Contoh test: 12 | 13 | ```jsx 14 | import { render, screen } from '@testing-library/react'; 15 | import Header from '../components/Header'; 16 | 17 | test('menampilkan judul', () => { 18 | render(
); 19 | expect(screen.getByText(/Dashboard/i)).toBeInTheDocument(); 20 | }); 21 | ``` 22 | 23 | --- 24 | 25 | ## 🗂️ Struktur Project Scalable 26 | 27 | - Pisahkan folder: `components/`, `hooks/`, `utils/`, `__tests__/` 28 | - Gunakan naming yang konsisten 29 | - Modularisasi komponen dan logic 30 | 31 | --- 32 | 33 | ## 💡 Best Practice 34 | 35 | - Komponen kecil, reusable, dan pure 36 | - Gunakan prop-types atau TypeScript untuk validasi props 37 | - Dokumentasikan struktur dan logic utama di README 38 | - Integrasi CI untuk test otomatis 39 | 40 | --- 41 | 42 | ## 🔗 Referensi 43 | - [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) 44 | - [Jest Docs](https://jestjs.io/) 45 | - [Best Practice React](https://react.dev/learn/thinking-in-react) 46 | 47 | --- 48 | 49 | > "Testing = jaminan kualitas. Struktur rapi = tim happy." -------------------------------------------------------------------------------- /resources/learn-something-fundamental/readme.md: -------------------------------------------------------------------------------- 1 | # 📖 Learn Something Fundamental 2 | 3 | Kumpulan materi pembelajaran berbagai topik teknologi — dari dasar hingga lanjutan. Cocok untuk pemula, intermediate, hingga expert. 4 | 5 | --- 6 | 7 | ## 📚 Daftar Topik Utama 8 | - Programming Language (HTML, CSS, JS, Java, Python, dst) 9 | - Library & Framework (React, Tailwind, Node.js, dst) 10 | - General Topics (Algoritma, Data Structure, DevOps, Cloud, dst) 11 | 12 | > Setiap topik berisi materi, tips, soal latihan, dan roadmap belajar. 13 | 14 | --- 15 | 16 | ## 🗂️ Struktur Direktori (Contoh) 17 | ``` 18 | learn-something-fundamental/ 19 | ├── programming-language/ 20 | │ ├── html/ 21 | │ ├── css/ 22 | │ ├── javascript/ 23 | │ └── ... 24 | ├── library-and-framework/ 25 | │ ├── react/ 26 | │ ├── tailwind/ 27 | │ └── ... 28 | ├── general-topics/ 29 | │ ├── algorithms/ 30 | │ ├── data-structure/ 31 | │ └── ... 32 | ``` 33 | 34 | --- 35 | 36 | ## 🧑‍💻 Kontribusi 37 | - Siapa saja boleh menambah/memperbaiki materi 38 | - Ikuti struktur dan gaya penulisan yang sudah ada 39 | - Lihat [CONTRIBUTING.md](../../contributing-guide.md) untuk panduan kontribusi 40 | 41 | --- 42 | 43 | ## 💡 Prinsip Penulisan 44 | - Bahasa sederhana, bertahap, dan inklusif 45 | - Banyak contoh, analogi, dan ilustrasi 46 | - Setiap subfolder bisa dikembangkan bertahap 47 | - Setiap topik bisa diusulkan/ditambah oleh kontributor lain 48 | 49 | > "Belajar teknologi itu maraton, bukan sprint. Mulai dari fundamental, lalu eksplorasi lebih dalam sesuai minatmu!" 🚀 -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/04/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧭 FUNDAMENTAL – Usability Testing & Iterasi 2 | 3 | Usability testing dan iterasi adalah proses inti dalam desain berbasis user: menguji, memperbaiki, dan mengulang hingga solusi benar-benar usable. 4 | 5 | --- 6 | 7 | ## 🔄 Apa Itu Usability Testing? 8 | 9 | - **Usability testing**: Menguji desain/prototype ke user nyata untuk menemukan masalah, hambatan, dan peluang perbaikan 10 | - Bisa dilakukan dengan wireframe, prototype, atau produk nyata 11 | 12 | ### Proses Umum: 13 | 1. Siapkan skenario/tugas untuk user 14 | 2. Observasi cara user menyelesaikan tugas 15 | 3. Catat masalah, kebingungan, feedback 16 | 4. Analisis dan prioritaskan temuan 17 | 5. Iterasi/perbaiki desain 18 | 19 | --- 20 | 21 | ## ♻️ Iterasi Desain 22 | 23 | - **Iterasi**: Proses memperbaiki desain berdasarkan feedback/testing 24 | - Seringkali perlu beberapa kali iterasi hingga desain optimal 25 | 26 | --- 27 | 28 | ## 💡 Tips Praktis 29 | - Uji ke user nyata, bukan hanya tim sendiri 30 | - Catat feedback secara objektif 31 | - Prioritaskan perbaikan berdampak besar dulu 32 | - Dokumentasikan proses iterasi untuk portofolio 33 | 34 | --- 35 | 36 | ## 🔗 Referensi 37 | - [NNG – Usability Testing](https://www.nngroup.com/articles/usability-testing-101/) 38 | - [Figma – Prototype Testing](https://help.figma.com/hc/en-us/articles/360040451373-Create-prototypes-in-Figma) 39 | - [Usability.gov – Testing](https://www.usability.gov/how-to-and-tools/methods/usability-testing.html) 40 | 41 | --- 42 | 43 | > "Desain terbaik lahir dari proses uji-coba dan perbaikan berulang, bukan dari ide pertama." -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/02/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧭 FUNDAMENTAL – Wireframing Mobile-First & Responsive Design 2 | 3 | Wireframing mobile-first adalah pendekatan desain yang memulai dari kebutuhan utama user di layar kecil, lalu dikembangkan ke layar lebih besar. 4 | 5 | --- 6 | 7 | ## 📱 Apa Itu Wireframe? 8 | 9 | - **Wireframe** adalah kerangka visual sederhana untuk menyusun struktur dan alur konten sebelum desain detail dibuat. 10 | - Fokus pada layout, urutan elemen, dan navigasi — bukan warna atau gambar. 11 | 12 | --- 13 | 14 | ## 📲 Mobile-First Design 15 | 16 | - **Mobile-first**: Mendesain dari layar terkecil (mobile) → tablet → desktop 17 | - Kenapa? Mayoritas user kini mengakses web/app dari mobile 18 | - Memaksa desainer fokus pada fitur utama, bukan dekorasi 19 | 20 | --- 21 | 22 | ## 🔄 Responsive Design 23 | 24 | - **Responsive**: Layout dan elemen menyesuaikan ukuran layar 25 | - Gunakan grid, flex, dan breakpoint untuk adaptasi 26 | - Uji wireframe di berbagai device (Figma: device preview) 27 | 28 | --- 29 | 30 | ## 💡 Tips Praktis 31 | - Mulai dari kebutuhan user: apa yang harus selalu terlihat? 32 | - Prioritaskan CTA dan navigasi utama 33 | - Tambahkan anotasi pada wireframe untuk komunikasi tim 34 | 35 | --- 36 | 37 | ## 🔗 Referensi 38 | - [Figma – Wireframing](https://help.figma.com/hc/en-us/articles/360040451373-Create-wireframes-in-Figma) 39 | - [Material Design – Layout](https://m3.material.io/foundations/layout/overview) 40 | - [Mobile-First Design](https://www.smashingmagazine.com/2011/07/mobile-first-a-presentation-by-luke-wroblewski/) 41 | 42 | --- 43 | 44 | > "Desain hebat dimulai dari kebutuhan utama user, bukan dari layar terbesar." -------------------------------------------------------------------------------- /resources/learn-something-fundamental/general-topics/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 General Topics 2 | 3 | Materi pembelajaran berbagai topik umum maupun spesifik di dunia teknologi, dari algoritma hingga cloud computing. Setiap topik memiliki folder sendiri yang berisi: 4 | - **fundamental.md**: Konsep dasar, teori, dan contoh kasus 5 | - **tips.md**: Tips belajar, best practice, sumber belajar 6 | - **latihan-soal.md**: Soal latihan dan challenge 7 | - **advanced.md**: Materi lanjutan dan studi kasus 8 | 9 | ## 📋 Daftar Topik Fundamental 10 | 11 | ### 🔤 Programming Basics 12 | - **Variables** - Tempat penyimpanan data dalam program 13 | - **Functions** - Blok kode yang dapat dipanggil berulang kali 14 | - **Arrays** - Struktur data untuk menyimpan kumpulan nilai 15 | - **Objects** - Struktur data key-value pairs 16 | - **Control Flow** - Mengontrol alur eksekusi program 17 | 18 | ### 🧮 Computer Science 19 | - **Algorithms** - Dasar logika dan pemecahan masalah 20 | - **Data Structures** - Cara menyimpan dan mengorganisir data 21 | - **Error Handling** - Menangani dan mengelola error 22 | - **Async Programming** - Operasi yang membutuhkan waktu 23 | 24 | ### 🛠️ Development Tools 25 | - **Version Control** - Mengelola perubahan kode 26 | - **Testing** - Memastikan kode berfungsi dengan benar 27 | - **Debugging** - Mencari dan memperbaiki bug 28 | - **Performance** - Optimasi dan efisiensi kode 29 | 30 | ### ☁️ Advanced Topics 31 | - **DevOps** - Development dan operations 32 | - **Cloud Computing** - Komputasi berbasis cloud 33 | - **Security** - Keamanan aplikasi dan data 34 | - **Architecture** - Desain sistem dan aplikasi 35 | 36 | > Setiap topik dirancang untuk pemula dengan penjelasan step-by-step dan contoh praktis! -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/01/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧱 FUNDAMENTAL – SPA, Struktur Project & Komponen Dasar 2 | 3 | Pada level Builder, kamu akan membangun aplikasi Single Page Application (SPA) dengan React. SPA memungkinkan pengalaman pengguna yang mulus tanpa reload halaman penuh. 4 | 5 | --- 6 | 7 | ## ⚛️ Apa Itu SPA? 8 | 9 | - **SPA (Single Page Application)**: Aplikasi web yang hanya memuat satu halaman HTML, navigasi dan update konten dilakukan secara dinamis via JavaScript. 10 | - Contoh: Gmail, Trello, Notion. 11 | 12 | --- 13 | 14 | ## 🗂️ Struktur Folder Project 15 | 16 | - **src/components/**: Komponen UI reusable (Header, Footer, dsb.) 17 | - **src/pages/**: Halaman utama aplikasi (Home, About, dsb.) 18 | - **src/assets/**: Gambar, ikon, file statis 19 | - **src/App.js**: Root komponen aplikasi 20 | - **src/index.js**: Entry point aplikasi 21 | 22 | --- 23 | 24 | ## 🧩 Komponen Dasar React 25 | 26 | - Komponen = fungsi yang mengembalikan JSX 27 | - Props = data yang dikirim ke komponen 28 | - Contoh: 29 | 30 | ```jsx 31 | function Header({ title }) { 32 | return

{title}

; 33 | } 34 | ``` 35 | 36 | - Komponen bisa diimpor dan digunakan di App.js 37 | 38 | --- 39 | 40 | ## 💡 Tips 41 | 42 | - Gunakan props untuk membuat komponen dinamis 43 | - Pisahkan komponen sesuai tanggung jawab 44 | - Struktur folder rapi = scaling mudah 45 | 46 | --- 47 | 48 | ## 🔗 Referensi 49 | - [React Components](https://react.dev/learn/your-first-component) 50 | - [SPA Concept](https://developer.mozilla.org/en-US/docs/Glossary/SPA) 51 | - [Vite + React](https://vitejs.dev/guide/) 52 | 53 | --- 54 | 55 | > "SPA dan komponen adalah pondasi utama frontend modern. Kuasai dasarnya, kamu siap membangun aplikasi apapun!" -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/02/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧱 FUNDAMENTAL – Data Fetching & State di React 2 | 3 | Mengambil data dari API dan menampilkannya secara dinamis adalah skill inti frontend modern. 4 | 5 | --- 6 | 7 | ## 🌐 Data Fetching di React 8 | 9 | - **fetch()**: API bawaan browser untuk HTTP request 10 | - **axios**: Library populer untuk HTTP request 11 | - Data fetching biasanya dilakukan di lifecycle mount (useEffect) 12 | 13 | --- 14 | 15 | ## ⚛️ useEffect untuk Fetch Data 16 | 17 | - useEffect dipakai untuk menjalankan side effect (seperti fetch data) setelah komponen render 18 | 19 | ```jsx 20 | import { useEffect, useState } from 'react'; 21 | 22 | useEffect(() => { 23 | fetch('https://jsonplaceholder.typicode.com/users') 24 | .then(res => res.json()) 25 | .then(data => setUsers(data)); 26 | }, []); 27 | ``` 28 | 29 | --- 30 | 31 | ## ⏳ Loading & Error State 32 | 33 | - Selalu sediakan state untuk loading dan error 34 | - Contoh: 35 | 36 | ```jsx 37 | const [loading, setLoading] = useState(true); 38 | const [error, setError] = useState(null); 39 | 40 | if (loading) return

Loading...

; 41 | if (error) return

Error: {error.message}

; 42 | ``` 43 | 44 | --- 45 | 46 | ## 💡 Tips 47 | 48 | - Gunakan custom hook untuk reusable data fetching 49 | - Selalu handle empty state (data kosong) 50 | - Pisahkan komponen list/item untuk modularitas 51 | 52 | --- 53 | 54 | ## 🔗 Referensi 55 | - [React useEffect](https://react.dev/reference/react/useEffect) 56 | - [MDN Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) 57 | - [Axios Docs](https://axios-http.com/) 58 | 59 | --- 60 | 61 | > "Frontend modern = data dinamis. Kuasai data fetching, kamu siap integrasi dengan backend manapun!" -------------------------------------------------------------------------------- /exercises/design/product-design/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Design – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun strategi produk, kolaborasi tim, dan menyiapkan produk untuk go-to-market. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat product strategy dan roadmap 10 | - Berkolaborasi dengan tim dev, bisnis, dan marketing 11 | - Menyiapkan produk untuk peluncuran (go-to-market) 12 | - Mengukur dan menganalisis impact produk 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Product Strategy & Roadmap | Strategi, milestone, timeline| 21 | | 02 | Kolaborasi Tim Produk | Teamwork, komunikasi, tools | 22 | | 03 | Go-to-Market & Launch Plan | Launch, marketing, feedback | 23 | | 04 | Impact Analysis & Iterasi | Data, insight, perbaikan | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (PDF/Figma/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Notion, Trello/Jira (roadmap, kolaborasi) 32 | - Figma (desain, prototyping) 33 | - Google Analytics (impact) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/product-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.pdf / .fig / .md 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan strategi dan kolaborasi 52 | - Tanyakan proses teamwork dan feedback peserta 53 | - Dorong eksplorasi data dan iterasi produk 54 | 55 | --- 56 | 57 | > "Strategi dan kolaborasi adalah kunci produk yang sukses di pasar nyata." 58 | -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/02/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🌳 FUNDAMENTAL – API Documentation & Testing 2 | 3 | Dokumentasi dan testing adalah dua pilar penting dalam pengembangan backend profesional. Tanpa keduanya, kolaborasi dan kualitas API akan sulit dijaga. 4 | 5 | --- 6 | 7 | ## 📄 Apa Itu API Documentation? 8 | 9 | - **API documentation** adalah deskripsi formal endpoint, request, response, dan error yang bisa diakses oleh developer lain (frontend, QA, dsb). 10 | - Standar industri: **OpenAPI/Swagger**. 11 | - Swagger UI memungkinkan dokumentasi interaktif dan auto-generated. 12 | 13 | --- 14 | 15 | ## 🛠️ Swagger/OpenAPI 16 | 17 | - **Swagger** adalah tool untuk mendeskripsikan API secara terstruktur (YAML/JSON). 18 | - Bisa diintegrasikan ke Express via `swagger-ui-express`. 19 | - Contoh endpoint dokumentasi: 20 | 21 | ```yaml 22 | paths: 23 | /notes: 24 | get: 25 | summary: Get all notes 26 | responses: 27 | '200': 28 | description: Success 29 | ``` 30 | 31 | --- 32 | 33 | ## 🧪 API Testing 34 | 35 | - **Testing** memastikan API berjalan sesuai kontrak. 36 | - Manual: Postman, Thunder Client 37 | - Otomatis: `jest`, `supertest` 38 | - Test case minimal: sukses, error, edge case 39 | 40 | --- 41 | 42 | ## 💡 Best Practice 43 | 44 | - Dokumentasi selalu update setiap ada perubahan endpoint 45 | - Simpan file collection test di repo 46 | - Automasi test untuk regression 47 | - Dokumentasi error response dan status code 48 | 49 | --- 50 | 51 | ## 🔗 Referensi 52 | - [Swagger/OpenAPI](https://swagger.io/docs/) 53 | - [Postman Docs](https://learning.postman.com/) 54 | - [Supertest](https://github.com/visionmedia/supertest) 55 | - [Jest](https://jestjs.io/) 56 | 57 | --- 58 | 59 | > "API yang baik = API yang terdokumentasi dan teruji." -------------------------------------------------------------------------------- /exercises/design/product-design/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Design – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam proses desain produk: user journey, MVP, prototyping, dan validasi solusi. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat user journey dan mapping kebutuhan user 10 | - Mendesain MVP dan prototyping interaktif 11 | - Melakukan validasi solusi ke user nyata 12 | - Mendokumentasikan proses dan insight produk 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | User Journey & Mapping | Journey map, pain point | 21 | | 02 | MVP & Prototyping | MVP scope, prototype interaktif| 22 | | 03 | Validasi & User Testing | User test, feedback, iterasi | 23 | | 04 | Dokumentasi & Insight Produk | Portfolio, insight, presentasi| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (PDF/Figma/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Figma, Miro/Whimsical (mapping, prototyping) 32 | - Google Forms/Typeform (user test) 33 | - Notion/Google Docs (dokumentasi) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/product-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.pdf / .fig / .md 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan proses dan insight user 52 | - Tanyakan alasan scope MVP dan iterasi peserta 53 | - Dorong eksplorasi dokumentasi dan portfolio 54 | 55 | --- 56 | 57 | > "Validasi dan iterasi adalah kunci produk yang benar-benar dibutuhkan user." 58 | -------------------------------------------------------------------------------- /exercises/design/product-design/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Design – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin mengenal proses desain produk digital dari riset, ideasi, hingga prototyping sederhana. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami dasar product thinking dan user-centric design 10 | - Mengenal proses riset user dan ideasi solusi 11 | - Membuat wireframe dan prototype sederhana 12 | - Melatih kemampuan presentasi ide produk 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Product Thinking Dasar | Problem/solution fit, riset | 21 | | 02 | User Research Sederhana | Interview, survey, insight | 22 | | 03 | Ideasi & Wireframing | Brainstorm, wireframe awal | 23 | | 04 | Prototype & Presentasi | Prototype low-fi, pitching | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (PDF/Figma/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Figma, Miro/Whimsical (ideation) 32 | - Google Forms/Typeform (riset user) 33 | - Notion/Google Docs (dokumentasi) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/product-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.pdf / .fig / .md 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan proses, bukan hanya output visual 52 | - Tanyakan insight dan alasan solusi peserta 53 | - Dorong eksplorasi referensi dan dokumentasi proses 54 | 55 | --- 56 | 57 | > "Product design dimulai dari pemahaman masalah user, bukan dari solusi visual dulu." 58 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/03/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 03: User Persona & Interview 👤 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🧭 Explorer 6 | > **Estimated Time**: 2–3 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Membuat user persona berdasarkan riset 13 | - Melakukan interview/survey sederhana ke calon user 14 | - Menganalisis kebutuhan dan motivasi user 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu akan mendesain fitur baru untuk aplikasi komunitas belajar. Sebelum membuat solusi, kamu perlu memahami siapa user utama dan apa kebutuhan/motivasi mereka. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Buat 1–2 user persona (template Figma/Google Docs) 27 | 2. Lakukan interview/survey ke minimal 2 orang (bisa online) 28 | 3. Catat insight utama: kebutuhan, motivasi, pain point 29 | 4. Dokumentasikan hasil di README.md dan persona.pdf 30 | 31 | --- 32 | 33 | ## ✨ Bonus Challenge 34 | 35 | - Buat empathy map untuk persona utama 36 | - Analisis perbedaan kebutuhan antar persona 37 | - Presentasikan hasil ke mentor/teman 38 | 39 | --- 40 | 41 | ## 📁 Struktur Folder 42 | 43 | ``` 44 | 03-user-persona-interview/ 45 | ├── README.md 46 | ├── fundamental.md 47 | ├── persona.pdf / .png 48 | ├── interview-notes.txt 49 | └── empathy-map.pdf (opsional) 50 | ``` 51 | 52 | --- 53 | 54 | ## ✅ Submission Format 55 | 56 | ``` 57 | submissions/design/uiux/[username]/03-user-persona-interview/ 58 | ``` 59 | 60 | --- 61 | 62 | ## 🔗 Referensi 63 | - [NNG – Personas](https://www.nngroup.com/articles/persona/) 64 | - [Empathy Map – Atlassian](https://www.atlassian.com/team-playbook/plays/empathy-map) 65 | - [Google Forms](https://forms.google.com/) 66 | 67 | --- 68 | 69 | > "Persona dan riset user adalah dasar solusi desain yang relevan dan berdampak nyata." -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/03/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧱 FUNDAMENTAL – State Management & Context di React 2 | 3 | State adalah data yang menentukan tampilan dan perilaku aplikasi. Di aplikasi besar, pengelolaan state yang baik sangat penting. 4 | 5 | --- 6 | 7 | ## 🗂️ State Lokal vs Global 8 | 9 | - **State lokal**: Data yang hanya dipakai di satu komponen (useState) 10 | - **State global**: Data yang dibutuhkan banyak komponen (user, theme, dsb.) 11 | 12 | --- 13 | 14 | ## 🔼 Lifting State & Prop Drilling 15 | 16 | - **Lifting state**: Memindahkan state ke parent agar bisa diakses child lain 17 | - **Prop drilling**: Mengoper state lewat banyak level props (bisa jadi masalah di app besar) 18 | 19 | --- 20 | 21 | ## 🌐 Context API 22 | 23 | - Solusi prop drilling: Context API 24 | - Buat context dengan `createContext`, sediakan value di provider, konsumsi di komponen manapun 25 | 26 | ```jsx 27 | import { createContext, useContext } from 'react'; 28 | 29 | const UserContext = createContext(); 30 | 31 | function App() { 32 | return ( 33 | 34 |
35 | 36 | ); 37 | } 38 | 39 | function Header() { 40 | const user = useContext(UserContext); 41 | return
Hi, {user.name}
; 42 | } 43 | ``` 44 | 45 | --- 46 | 47 | ## 💡 Tips 48 | 49 | - Gunakan custom hook untuk context agar lebih clean 50 | - Untuk state kompleks, pertimbangkan Redux/Zustand 51 | - Persist state penting ke localStorage 52 | 53 | --- 54 | 55 | ## 🔗 Referensi 56 | - [React Context](https://react.dev/reference/react/createContext) 57 | - [State Management Patterns](https://react.dev/learn/scaling-up-with-reducer-and-context) 58 | - [Redux](https://redux.js.org/) 59 | 60 | --- 61 | 62 | > "State dan context = pondasi aplikasi frontend yang scalable." -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/04/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 04: Handoff & Developer Spec 🔄 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🏗️ Builder 6 | > **Estimated Time**: 2–3 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Melakukan handoff desain ke developer (spec, asset, dokumentasi) 13 | - Menyusun dokumentasi developer-friendly 14 | - Berkolaborasi dengan tim dev untuk implementasi 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu akan menyiapkan handoff desain hi-fi ke tim developer. Tugasmu adalah menyiapkan spec, export asset, dan dokumentasi agar dev bisa mengimplementasikan desain dengan akurat. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Siapkan file spec (spacing, warna, font, dsb.) di Figma/Zeplin 27 | 2. Export asset (ikon, gambar) sesuai kebutuhan dev 28 | 3. Buat dokumentasi singkat (Notion/Google Docs) 29 | 4. Kolaborasi dengan dev: review implementasi, feedback 30 | 31 | --- 32 | 33 | ## ✨ Bonus Challenge 34 | 35 | - Buat video walkthrough handoff 36 | - Checklist implementasi dev 37 | - Uji hasil implementasi dev vs desain 38 | 39 | --- 40 | 41 | ## 📁 Struktur Folder 42 | 43 | ``` 44 | 04-handoff-developer-spec/ 45 | ├── README.md 46 | ├── fundamental.md 47 | ├── spec.pdf / .png 48 | ├── asset/ 49 | └── docs-link.txt (opsional) 50 | ``` 51 | 52 | --- 53 | 54 | ## ✅ Submission Format 55 | 56 | ``` 57 | submissions/design/uiux/[username]/04-handoff-developer-spec/ 58 | ``` 59 | 60 | --- 61 | 62 | ## 🔗 Referensi 63 | - [Figma – Handoff](https://help.figma.com/hc/en-us/articles/360040451373-Developer-handoff-in-Figma) 64 | - [Zeplin](https://zeplin.io/) 65 | - [Material Design – Developer Guide](https://m3.material.io/develop/overview) 66 | 67 | --- 68 | 69 | > "Handoff yang baik = kolaborasi lancar, implementasi akurat, dan produk berkualitas." -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/02/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 02: Design System Starter 🧩 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🏗️ Builder 6 | > **Estimated Time**: 3–4 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Membuat design system sederhana (komponen, style guide) 13 | - Menyusun dokumentasi visual untuk tim 14 | - Menerapkan prinsip konsistensi dan reusability 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu akan membangun design system starter untuk aplikasi komunitas belajar. Design system ini akan menjadi acuan visual dan komponen untuk seluruh tim desain/dev. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Buat style guide: warna, tipografi, spacing, ikon 27 | 2. Buat minimal 3 komponen utama (button, card, input, dsb.) 28 | 3. Dokumentasikan aturan penggunaan komponen 29 | 4. Buat file Figma/Notion untuk dokumentasi 30 | 31 | --- 32 | 33 | ## ✨ Bonus Challenge 34 | 35 | - Tambahkan variant (primary/secondary, state aktif/disable) 36 | - Buat halaman dokumentasi online (Notion/Zeroheight) 37 | - Uji design system ke tim/mentor 38 | 39 | --- 40 | 41 | ## 📁 Struktur Folder 42 | 43 | ``` 44 | 02-design-system-starter/ 45 | ├── README.md 46 | ├── fundamental.md 47 | ├── design-system.fig / .pdf 48 | ├── style-guide.pdf 49 | └── docs-link.txt (opsional) 50 | ``` 51 | 52 | --- 53 | 54 | ## ✅ Submission Format 55 | 56 | ``` 57 | submissions/design/uiux/[username]/02-design-system-starter/ 58 | ``` 59 | 60 | --- 61 | 62 | ## 🔗 Referensi 63 | - [Design Systems Repo](https://designsystemsrepo.com/) 64 | - [Material Design – Design System](https://m3.material.io/foundations/design-system/overview) 65 | - [Zeroheight](https://zeroheight.com/) 66 | 67 | --- 68 | 69 | > "Design system adalah fondasi kolaborasi dan konsistensi visual dalam tim desain dan developer." -------------------------------------------------------------------------------- /exercises/design/graphic-design/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 🖼️ Graphic Design – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun portofolio desain nyata, mengerjakan proyek klien simulasi, dan mengembangkan karya visual tingkat lanjut. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat karya desain untuk kebutuhan nyata (klien simulasi) 10 | - Mengembangkan portofolio desain digital/cetak 11 | - Mengasah skill presentasi dan revisi desain 12 | - Berkolaborasi dengan tim produk/marketing 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Proyek Klien Simulasi | Brief, presentasi, revisi | 21 | | 02 | Mockup Produk & Packaging | Mockup, visualisasi produk | 22 | | 03 | Portofolio Digital | Kurasi karya, presentasi | 23 | | 04 | Kolaborasi Tim (Simulasi) | Kolaborasi, feedback, revisi | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (JPG/PNG/PDF/Figma). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Figma, Photoshop, Illustrator, Canva 32 | - Mockup tools (Smartmockups, Placeit) 33 | - Google Slides/Canva (presentasi) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/graphic-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.jpg / .png / .pdf 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan kebutuhan klien/brief 52 | - Tanyakan proses revisi dan presentasi peserta 53 | - Dorong eksplorasi portofolio dan feedback 54 | 55 | --- 56 | 57 | > "Portofolio dan proyek nyata adalah bukti kemampuan dan proses belajar desain yang sesungguhnya." 58 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 🖼️ Graphic Design – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi creative/art director, membangun konsep visual besar, dan memimpin proyek desain kolaboratif. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan konsep visual dan creative direction 10 | - Memimpin proyek desain kolaboratif (tim/komunitas) 11 | - Membuat karya inovatif untuk kompetisi/pameran 12 | - Membangun personal branding dan thought leadership 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Creative Direction | Konsep visual, moodboard | 21 | | 02 | Art Direction & Team Project | Leadership, kolaborasi tim | 22 | | 03 | Karya Inovatif & Eksperimen | Eksplorasi teknik baru | 23 | | 04 | Pameran/Kompetisi Desain | Presentasi, publikasi karya | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (JPG/PNG/PDF/Figma). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Figma, Photoshop, Illustrator, Canva 32 | - Miro/Notion (kolaborasi) 33 | - Behance/Dribbble (publikasi) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/graphic-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.jpg / .png / .pdf 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan inovasi dan leadership 52 | - Tanyakan proses kolaborasi dan presentasi peserta 53 | - Dorong eksplorasi publikasi dan kompetisi 54 | 55 | --- 56 | 57 | > "Inovasi dan kepemimpinan visual adalah puncak perjalanan desain grafis. Berani bereksperimen dan berbagi karya!" 58 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🖼️ Graphic Design – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin mengenal dunia desain grafis. Fokus latihan adalah membangun dasar visual, mengenal tools, dan membuat karya sederhana. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami prinsip dasar desain grafis (komposisi, warna, tipografi) 10 | - Mengenal tools desain populer (Canva, Figma, Photoshop) 11 | - Membuat karya visual sederhana: poster, logo, social media 12 | - Melatih observasi dan kritik visual 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Komposisi & Layout Dasar | Grid, alignment, balance | 21 | | 02 | Warna & Tipografi | Color theory, font pairing | 22 | | 03 | Logo & Branding Sederhana | Logo, icon, brand identity | 23 | | 04 | Poster/Social Media Visual | Visual campaign, storytelling| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (JPG/PNG/PDF/Figma). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Canva, Figma, Photoshop/Illustrator (opsional) 32 | - Google Fonts 33 | - Coolors.co (palet warna) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/graphic-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.jpg / .png / .pdf 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan prinsip desain, bukan selera pribadi 52 | - Tanyakan alasan visual peserta 53 | - Dorong eksplorasi referensi dan portofolio 54 | 55 | --- 56 | 57 | > "Desain grafis adalah latihan visual dan komunikasi. Mulai dari dasar, lalu terus eksplorasi!" 58 | -------------------------------------------------------------------------------- /exercises/design/graphic-design/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 🖼️ Graphic Design – Explorer Level 2 | 3 | Level ini untuk peserta yang sudah memahami dasar desain grafis dan ingin memperdalam skill branding, ilustrasi, dan layout untuk media digital/cetak. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat karya branding (logo, brand guideline) 10 | - Mengasah skill ilustrasi digital dan manipulasi gambar 11 | - Mendesain layout untuk media sosial, poster, atau brosur 12 | - Memahami storytelling visual dan campaign 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Branding & Logo Lanjutan | Brand identity, logo, guideline| 21 | | 02 | Ilustrasi Digital Dasar | Drawing, vector, digital art | 22 | | 03 | Layout Media Sosial/Brosur | Grid, hierarchy, CTA visual | 23 | | 04 | Visual Campaign Storytelling | Narasi visual, moodboard | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (JPG/PNG/PDF/Figma). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Figma, Illustrator, Canva, Procreate (opsional) 32 | - Google Fonts, Unsplash (gambar) 33 | - Coolors.co, Paletton (warna) 34 | 35 | --- 36 | 37 | ## ✅ Submission Format 38 | 39 | ``` 40 | submissions/design/graphic-design/[username]/[exercise-folder]/ 41 | ├── README.md 42 | ├── karya.jpg / .png / .pdf 43 | ├── fundamental.md 44 | └── log.md 45 | ``` 46 | 47 | --- 48 | 49 | ## 💬 Catatan untuk Mentor 50 | 51 | - Validasi hasil berdasarkan prinsip desain dan branding 52 | - Tanyakan alasan visual dan narasi peserta 53 | - Dorong eksplorasi referensi dan portofolio 54 | 55 | --- 56 | 57 | > "Branding dan ilustrasi adalah cara membangun identitas visual yang kuat dan mudah diingat." 58 | -------------------------------------------------------------------------------- /exercises/design/product-design/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Design – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi product leader, mengembangkan inovasi produk, dan memimpin tim lintas fungsi. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan product vision dan growth strategy 10 | - Memimpin tim produk dan inovasi 11 | - Membuat studi kasus end-to-end (dari riset ke launch) 12 | - Berkontribusi pada komunitas produk (sharing, mentoring) 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Product Vision & Growth | Vision, growth, leadership | 21 | | 02 | Inovasi & Experimentation | Eksperimen, A/B test, pivot | 22 | | 03 | Studi Kasus End-to-End | Riset, desain, launch, iterasi| 23 | | 04 | Sharing & Mentoring Produk | Dokumentasi, mentoring, sharing| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file karya (PDF/Figma/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Notion, Trello/Jira (leadership, roadmap) 32 | - Figma (desain, prototyping) 33 | - Google Analytics (growth) 34 | - Medium/Blog (sharing) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/design/product-design/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── karya.pdf / .fig / .md 44 | ├── fundamental.md 45 | └── log.md 46 | ``` 47 | 48 | --- 49 | 50 | ## 💬 Catatan untuk Mentor 51 | 52 | - Validasi hasil berdasarkan inovasi dan leadership 53 | - Tanyakan proses mentoring dan sharing peserta 54 | - Dorong eksplorasi growth dan kontribusi komunitas 55 | 56 | --- 57 | 58 | > "Inovasi dan kepemimpinan produk adalah puncak perjalanan product design. Berani berbagi dan memimpin perubahan!" 59 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/03/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 03: Accessibility Audit & Fix ♿ 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🏗️ Builder 6 | > **Estimated Time**: 2–3 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Melakukan audit aksesibilitas pada desain/prototype 13 | - Memperbaiki masalah aksesibilitas yang ditemukan 14 | - Menguji desain dengan tools aksesibilitas 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu akan mengaudit desain/prototype aplikasi komunitas belajar untuk memastikan aksesibilitas bagi semua user, termasuk disabilitas visual/motorik. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Audit desain/prototype dengan tools (Stark, Contrast Checker, dsb.) 27 | 2. Identifikasi minimal 3 masalah aksesibilitas 28 | 3. Perbaiki desain dan dokumentasikan perubahan 29 | 4. Uji ulang dengan tools dan user (jika memungkinkan) 30 | 31 | --- 32 | 33 | ## ✨ Bonus Challenge 34 | 35 | - Buat checklist aksesibilitas untuk tim 36 | - Uji desain dengan screen reader 37 | - Presentasikan hasil audit ke tim/mentor 38 | 39 | --- 40 | 41 | ## 📁 Struktur Folder 42 | 43 | ``` 44 | 03-accessibility-audit-fix/ 45 | ├── README.md 46 | ├── fundamental.md 47 | ├── audit-report.pdf 48 | ├── fixed-design.fig / .png 49 | └── checklist.txt (opsional) 50 | ``` 51 | 52 | --- 53 | 54 | ## ✅ Submission Format 55 | 56 | ``` 57 | submissions/design/uiux/[username]/03-accessibility-audit-fix/ 58 | ``` 59 | 60 | --- 61 | 62 | ## 🔗 Referensi 63 | - [Stark – Accessibility Tools](https://www.getstark.co/) 64 | - [Material Design – Accessibility](https://m3.material.io/foundations/accessibility/overview) 65 | - [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/) 66 | 67 | --- 68 | 69 | > "Aksesibilitas adalah hak semua user. Audit dan perbaiki desainmu agar inklusif dan ramah semua orang." -------------------------------------------------------------------------------- /exercises/development/fullstack/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 Fullstack Development – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun aplikasi fullstack yang kompleks, scalable, dan siap untuk production. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat aplikasi fullstack yang scalable dan maintainable 10 | - Menerapkan arsitektur yang baik (MVC, microservices) 11 | - Mengintegrasikan third-party services dan APIs 12 | - Mengoptimalkan performance dan security aplikasi 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Scalable Architecture | MVC, microservices, patterns | 21 | | 02 | Third-party Integration | Payment, email, social login | 22 | | 03 | Performance Optimization | Caching, CDN, database tuning| 23 | | 04 | Production-ready App | Monitoring, logging, testing | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode lengkap. 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - React/Vue, Express/Django 32 | - Redis, PostgreSQL/MySQL 33 | - Stripe, SendGrid, OAuth 34 | - Docker, Kubernetes 35 | - New Relic, Sentry 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/fullstack/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── frontend/ 45 | ├── backend/ 46 | ├── database/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan scalability dan maintainability 55 | - Tanyakan alasan arsitektur dan optimization choices 56 | - Dorong eksplorasi monitoring dan production deployment 57 | 58 | --- 59 | 60 | > "Production-ready aplikasi membutuhkan arsitektur yang baik, monitoring, dan optimization." 61 | -------------------------------------------------------------------------------- /exercises/business/project-management/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 📋 Project Management – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin mengenal dunia project management, dari dasar planning hingga tracking dan team coordination. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami dasar project management dan lifecycle 10 | - Membuat project plan dan timeline sederhana 11 | - Menggunakan tools project management dasar 12 | - Melakukan tracking dan reporting progress 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Project Planning Dasar | Scope, timeline, resources | 21 | | 02 | Task Management & Tracking | Task breakdown, progress tracking| 22 | | 03 | Team Communication | Meeting, reporting, updates | 23 | | 04 | Risk Assessment Sederhana | Risk identification, mitigation| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Trello, Asana (task management) 32 | - Google Sheets, Excel (planning) 33 | - Slack, Zoom (communication) 34 | - Google Docs, Notion (dokumentasi) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/project-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── planning/ 44 | ├── tracking/ 45 | ├── communication/ 46 | └── documentation/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan planning dan tracking effectiveness 54 | - Tanyakan alasan timeline dan resource allocation 55 | - Dorong eksplorasi communication dan risk management 56 | 57 | --- 58 | 59 | > "Project management dimulai dari perencanaan yang baik dan tracking yang konsisten." -------------------------------------------------------------------------------- /exercises/development/fullstack/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 Fullstack Development – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin belajar pengembangan web lengkap dari frontend hingga backend, database, dan deployment dasar. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami dasar frontend (HTML, CSS, JavaScript) dan backend (Node.js/Python) 10 | - Membuat aplikasi web sederhana dengan database 11 | - Mengintegrasikan frontend dan backend melalui API 12 | - Melakukan deployment aplikasi ke platform hosting 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Frontend + Backend Dasar | HTML, CSS, JS, server sederhana| 21 | | 02 | Database & API Sederhana | Database, REST API, CRUD | 22 | | 03 | Integrasi Frontend-Backend | Fetch API, form handling | 23 | | 04 | Mini Project: Todo App | Aplikasi lengkap, deployment | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode (HTML/CSS/JS/Node.js). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - HTML, CSS, JavaScript 32 | - Node.js, Express.js 33 | - SQLite/MySQL 34 | - Git, GitHub 35 | - Heroku/Vercel (deployment) 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/fullstack/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── frontend/ 45 | ├── backend/ 46 | ├── database/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan integrasi frontend-backend 55 | - Tanyakan alasan arsitektur dan database design 56 | - Dorong eksplorasi deployment dan hosting 57 | 58 | --- 59 | 60 | > "Fullstack development adalah tentang memahami keseluruhan flow aplikasi dari UI hingga database." 61 | -------------------------------------------------------------------------------- /exercises/development/fullstack/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 Fullstack Development – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi technical leader, mengembangkan arsitektur sistem yang kompleks, dan memimpin tim development. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan arsitektur sistem yang kompleks dan scalable 10 | - Memimpin tim development dan code review 11 | - Membuat sistem yang terdistribusi (distributed systems) 12 | - Berkontribusi pada open source dan komunitas developer 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Distributed Systems | Microservices, message queues| 21 | | 02 | Technical Leadership | Code review, mentoring, architecture| 22 | | 03 | Advanced Fullstack App | Complex app, multiple services| 23 | | 04 | Open Source Contribution | Contributing, documentation | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode lengkap. 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - React/Vue, Express/Django 32 | - Redis, PostgreSQL/MySQL 33 | - RabbitMQ, Apache Kafka 34 | - Docker, Kubernetes 35 | - GitHub, open source tools 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/fullstack/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── frontend/ 45 | ├── backend/ 46 | ├── database/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan arsitektur dan leadership 55 | - Tanyakan proses mentoring dan code review 56 | - Dorong eksplorasi open source dan kontribusi komunitas 57 | 58 | --- 59 | 60 | > "Technical leadership adalah tentang membangun sistem yang scalable dan memimpin tim menuju kesuksesan." 61 | -------------------------------------------------------------------------------- /exercises/development/mobile/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 📱 Mobile Development – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi mobile development leader, mengembangkan native modules, dan memimpin tim mobile development. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan native modules dan custom components 10 | - Memimpin tim mobile development dan code review 11 | - Mengoptimalkan aplikasi untuk performance maksimal 12 | - Berkontribusi pada open source mobile libraries 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Native Modules Development | Custom native code, bridging | 21 | | 02 | Mobile Team Leadership | Code review, mentoring, architecture| 22 | | 03 | Advanced Mobile App | Complex app, multiple platforms| 23 | | 04 | Open Source Contribution | Contributing, documentation | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode lengkap. 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - React Native/Flutter 32 | - Native modules, bridging 33 | - Performance profiling tools 34 | - GitHub, open source tools 35 | - Team collaboration tools 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/mobile/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── src/ 45 | ├── assets/ 46 | ├── tests/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan native development dan leadership 55 | - Tanyakan proses mentoring dan code review 56 | - Dorong eksplorasi open source dan kontribusi komunitas 57 | 58 | --- 59 | 60 | > "Mobile development leadership adalah tentang membangun aplikasi yang performant dan memimpin tim menuju kesuksesan." 61 | -------------------------------------------------------------------------------- /exercises/business/project-management/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 📋 Project Management – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam skill project management dengan Agile/Scrum, team management, dan risk assessment. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Menerapkan metodologi Agile/Scrum dalam project management 10 | - Mengelola tim dan stakeholder communication 11 | - Melakukan risk assessment dan mitigation strategies 12 | - Menggunakan advanced project management tools 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Agile/Scrum Implementation | Sprint planning, daily standup| 21 | | 02 | Team Management | Team building, conflict resolution| 22 | | 03 | Risk Management | Risk assessment, mitigation | 23 | | 04 | Stakeholder Communication | Reporting, alignment, feedback| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Jira, Asana (Agile tools) 32 | - Slack, Zoom (team communication) 33 | - Confluence, Notion (dokumentasi) 34 | - Power BI, Tableau (reporting) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/project-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── agile/ 44 | ├── team/ 45 | ├── risk/ 46 | └── stakeholder/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan Agile implementation dan team effectiveness 54 | - Tanyakan alasan risk assessment dan stakeholder management 55 | - Dorong eksplorasi team dynamics dan communication strategies 56 | 57 | --- 58 | 59 | > "Agile dan team management adalah kunci project management yang adaptif dan efektif." -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/01/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🧭 FUNDAMENTAL – User Flow & Journey Mapping 2 | 3 | User flow dan journey mapping adalah alat utama untuk memahami dan memetakan pengalaman pengguna secara menyeluruh sebelum membuat desain visual. 4 | 5 | --- 6 | 7 | ## 🗺️ Apa Itu User Flow? 8 | 9 | - **User flow** adalah diagram yang menggambarkan langkah-langkah yang diambil user untuk mencapai tujuan tertentu di aplikasi/website. 10 | - Biasanya berupa kotak (langkah) dan panah (alur). 11 | - Contoh: flow pendaftaran, pembelian, booking, dsb. 12 | 13 | ### Manfaat User Flow: 14 | - Memastikan alur logis dan efisien 15 | - Mengidentifikasi langkah yang membingungkan atau tidak perlu 16 | - Menjadi acuan wireframe dan prototipe 17 | 18 | --- 19 | 20 | ## 🧩 Apa Itu Journey Mapping? 21 | 22 | - **Journey map** adalah visualisasi perjalanan user dari awal hingga akhir, termasuk emosi, ekspektasi, dan pain point di setiap langkah. 23 | - Biasanya lebih detail dari user flow, mencakup: 24 | - Tahapan (step) 25 | - Emosi/ekspektasi 26 | - Pain point 27 | - Peluang perbaikan 28 | 29 | ### Manfaat Journey Mapping: 30 | - Memahami pengalaman user secara holistik 31 | - Mengidentifikasi masalah tersembunyi 32 | - Menemukan peluang inovasi desain 33 | 34 | --- 35 | 36 | ## 💡 Tips Praktis 37 | - Libatkan user nyata (interview/survey) jika memungkinkan 38 | - Gunakan warna/ikon untuk menandai emosi dan pain point 39 | - Sederhanakan diagram agar mudah dipahami tim 40 | 41 | --- 42 | 43 | ## 🔗 Referensi 44 | - [NNG – Journey Mapping](https://www.nngroup.com/articles/customer-journey-mapping/) 45 | - [Figma – User Flow](https://help.figma.com/hc/en-us/articles/360040451373-Create-user-flows-in-Figma) 46 | - [UXPressia – Persona & Journey Map](https://uxpressia.com/) 47 | 48 | --- 49 | 50 | > "Desain yang baik dimulai dari pemahaman mendalam tentang perjalanan dan masalah pengguna, bukan dari visual dulu." -------------------------------------------------------------------------------- /exercises/development/fullstack/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 Fullstack Development – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam skill fullstack dengan framework modern, database lanjutan, dan deployment yang lebih kompleks. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Menggunakan framework frontend (React/Vue) dan backend (Express/Django) 10 | - Menerapkan database design yang lebih kompleks 11 | - Membuat aplikasi dengan authentication dan authorization 12 | - Mengelola deployment dengan CI/CD dan cloud services 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | React/Vue + Express/Django | Framework, component, routing| 21 | | 02 | Database Design Lanjutan | Relasi, indexing, optimization| 22 | | 03 | Authentication & Security | JWT, bcrypt, middleware | 23 | | 04 | Deployment & CI/CD | GitHub Actions, cloud hosting| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode (React/Vue/Express/Django). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - React/Vue, Express.js/Django 32 | - PostgreSQL/MySQL 33 | - JWT, bcrypt 34 | - GitHub Actions, Docker 35 | - AWS/Vercel/Heroku 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/fullstack/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── frontend/ 45 | ├── backend/ 46 | ├── database/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan arsitektur dan security 55 | - Tanyakan alasan framework choice dan database design 56 | - Dorong eksplorasi CI/CD dan cloud deployment 57 | 58 | --- 59 | 60 | > "Framework dan tools modern mempercepat development, tapi tetap perlu memahami konsep dasarnya." 61 | -------------------------------------------------------------------------------- /exercises/development/mobile/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 📱 Mobile Development – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam skill mobile development dengan state management, API integration, dan fitur mobile yang lebih kompleks. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Menggunakan state management (Redux, MobX, Provider) 10 | - Mengintegrasikan dengan REST API dan backend services 11 | - Menerapkan local storage dan offline capabilities 12 | - Membuat UI components yang reusable dan responsive 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | State Management | Redux, MobX, Provider | 21 | | 02 | API Integration & Networking | REST API, HTTP client, error handling| 22 | | 03 | Local Storage & Offline | AsyncStorage, SQLite, sync | 23 | | 04 | Reusable Components | Component library, theming | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode (React Native/Flutter). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - React Native/Flutter 32 | - Redux, MobX, Provider 33 | - Axios, Fetch API 34 | - AsyncStorage, SQLite 35 | - Expo, Android Studio, Xcode 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/mobile/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── src/ 45 | ├── assets/ 46 | ├── tests/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan state management dan API integration 55 | - Tanyakan alasan architecture dan component design 56 | - Dorong eksplorasi offline capabilities dan performance 57 | 58 | --- 59 | 60 | > "State management dan API integration adalah kunci aplikasi mobile yang powerful dan user-friendly." 61 | -------------------------------------------------------------------------------- /exercises/business/product-management/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Management – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin mengenal dunia product management, dari dasar product thinking hingga user research dan roadmap. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami dasar product thinking dan product lifecycle 10 | - Melakukan user research dan analisis kebutuhan user 11 | - Membuat product roadmap dan backlog sederhana 12 | - Berkolaborasi dengan tim design dan engineering 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Product Thinking Dasar | Problem/solution fit, user needs| 21 | | 02 | User Research & Persona | Interview, survey, persona | 22 | | 03 | Product Roadmap Sederhana | Roadmap, backlog, prioritization| 23 | | 04 | Stakeholder Communication | Presentasi, dokumentasi, feedback| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Notion, Google Docs (dokumentasi) 32 | - Typeform, Google Forms (user research) 33 | - Figma, Miro (roadmap, persona) 34 | - Slack, Zoom (komunikasi) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/product-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── documentation/ 44 | ├── research/ 45 | ├── roadmap/ 46 | └── presentation/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan proses dan insight user 54 | - Tanyakan alasan prioritization dan roadmap choices 55 | - Dorong eksplorasi user research dan stakeholder communication 56 | 57 | --- 58 | 59 | > "Product management dimulai dari pemahaman mendalam tentang user dan masalah yang mereka hadapi." -------------------------------------------------------------------------------- /exercises/business/strategy/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🎯 Strategy – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin mengenal dunia strategic thinking, market analysis, dan strategic frameworks dasar. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami dasar strategic thinking dan strategic frameworks 10 | - Melakukan market analysis dan competitive landscape analysis 11 | - Membuat strategic analysis sederhana (SWOT, PESTLE) 12 | - Berkolaborasi dengan stakeholders untuk strategic planning 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Strategic Thinking Dasar | Strategic frameworks, analysis| 21 | | 02 | Market Analysis | Market research, competitive landscape| 22 | | 03 | SWOT & PESTLE Analysis | Internal/external analysis | 23 | | 04 | Strategic Planning Sederhana | Goal setting, action planning| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - PowerPoint, Google Slides (presentasi) 32 | - Excel, Google Sheets (analysis) 33 | - Miro, Notion (strategic planning) 34 | - Market research tools 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/strategy/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── analysis/ 44 | ├── planning/ 45 | ├── presentation/ 46 | └── documentation/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan strategic thinking dan analysis quality 54 | - Tanyakan alasan framework choices dan market insights 55 | - Dorong eksplorasi competitive analysis dan strategic planning 56 | 57 | --- 58 | 59 | > "Strategic thinking dimulai dari pemahaman mendalam tentang market dan competitive landscape." -------------------------------------------------------------------------------- /exercises/business/project-management/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 📋 Project Management – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi program manager, mengelola portfolio projects, dan memimpin executive leadership dalam project management. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengelola program management dan portfolio projects 10 | - Memimpin executive leadership dalam project management 11 | - Menerapkan advanced methodologies dan innovation 12 | - Berkontribusi pada komunitas project management 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Program Management | Portfolio, strategic alignment| 21 | | 02 | Executive Leadership | C-level communication, strategy| 22 | | 03 | Innovation in PM | New methodologies, tools | 23 | | 04 | Community & Thought Leadership| Speaking, writing, mentoring | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Enterprise PM tools 32 | - Executive presentation tools 33 | - Innovation platforms 34 | - Community platforms 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/project-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── program/ 44 | ├── leadership/ 45 | ├── innovation/ 46 | └── community/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan program management dan executive leadership 54 | - Tanyakan proses innovation dan thought leadership 55 | - Dorong eksplorasi community building dan mentoring 56 | 57 | --- 58 | 59 | > "Program management dan executive leadership adalah puncak perjalanan project management yang strategis dan berdampak." -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/01/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 01: Hi-Fi Design & Prototyping 🎨 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🏗️ Builder 6 | > **Estimated Time**: 3–4 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Membuat desain high-fidelity (hi-fi) di Figma 13 | - Membuat prototype interaktif (clickable) 14 | - Menyusun layout, warna, dan tipografi sesuai brand 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu akan membuat desain hi-fi untuk halaman utama aplikasi komunitas belajar. Desain harus siap dipresentasikan ke stakeholder dan bisa diuji sebagai prototype interaktif. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Buat desain hi-fi (Figma) untuk homepage aplikasi 27 | 2. Terapkan style guide: warna, font, komponen konsisten 28 | 3. Buat prototype interaktif (navigasi, CTA, dsb.) 29 | 4. Dokumentasikan rationale desain di README.md 30 | 31 | --- 32 | 33 | ## ✨ Bonus Challenge 34 | 35 | - Buat animasi transisi sederhana di prototype 36 | - Uji prototype ke 2 user, catat feedback 37 | - Buat versi dark mode 38 | 39 | --- 40 | 41 | ## 📁 Struktur Folder 42 | 43 | ``` 44 | 01-hi-fi-design-prototyping/ 45 | ├── README.md 46 | ├── fundamental.md 47 | ├── hi-fi.fig / .png 48 | ├── prototype-link.txt 49 | └── feedback.txt (opsional) 50 | ``` 51 | 52 | --- 53 | 54 | ## ✅ Submission Format 55 | 56 | ``` 57 | submissions/design/uiux/[username]/01-hi-fi-design-prototyping/ 58 | ``` 59 | 60 | --- 61 | 62 | ## 🔗 Referensi 63 | - [Figma – Hi-Fi Design](https://help.figma.com/hc/en-us/articles/360040451373-Create-high-fidelity-designs-in-Figma) 64 | - [Figma – Prototyping](https://help.figma.com/hc/en-us/articles/360040451373-Create-prototypes-in-Figma) 65 | - [Material Design – Components](https://m3.material.io/components) 66 | 67 | --- 68 | 69 | > "Hi-fi design dan prototyping adalah jembatan antara ide dan produk nyata yang siap diuji dan dikembangkan." -------------------------------------------------------------------------------- /exercises/business/business-analysis/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 📊 Business Analysis – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun advanced business analysis, system design, dan change management capabilities. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Menerapkan advanced business analysis methodologies 10 | - Mendesain sistem dan enterprise architecture 11 | - Mengelola change management dan organizational transformation 12 | - Memimpin complex business analysis projects 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Advanced Business Analysis | Enterprise analysis, strategy | 21 | | 02 | System Design & Architecture | System requirements, design | 22 | | 03 | Change Management | Organizational change, adoption| 23 | | 04 | Complex Project Leadership | Multi-stakeholder, complex requirements| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Enterprise architecture tools 32 | - Advanced modeling platforms 33 | - Change management tools 34 | - Project management platforms 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/business-analysis/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── advanced-analysis/ 44 | ├── system-design/ 45 | ├── change-management/ 46 | └── leadership/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan advanced analysis dan system design 54 | - Tanyakan alasan change management dan organizational impact 55 | - Dorong eksplorasi enterprise architecture dan strategic analysis 56 | 57 | --- 58 | 59 | > "Advanced business analysis membutuhkan pemahaman mendalam tentang enterprise architecture dan organizational change." -------------------------------------------------------------------------------- /exercises/business/project-management/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 📋 Project Management – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun complex project management, stakeholder management, dan delivery excellence. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengelola complex projects dengan multiple stakeholders 10 | - Menerapkan advanced project management methodologies 11 | - Mengoptimalkan delivery processes dan quality assurance 12 | - Memimpin cross-functional teams dan vendor management 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Complex Project Management | Multi-stakeholder, dependencies| 21 | | 02 | Quality Assurance | QA processes, testing, delivery| 22 | | 03 | Vendor Management | Outsourcing, contract management| 23 | | 04 | Delivery Excellence | Optimization, best practices | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Advanced PM tools (Jira, Monday.com) 32 | - Quality management tools 33 | - Vendor management platforms 34 | - Advanced reporting tools 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/project-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── complex-projects/ 44 | ├── quality/ 45 | ├── vendor/ 46 | └── delivery/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan complex project management dan delivery excellence 54 | - Tanyakan alasan quality assurance dan vendor management strategies 55 | - Dorong eksplorasi optimization dan best practices 56 | 57 | --- 58 | 59 | > "Complex project management membutuhkan pemahaman mendalam tentang dependencies, quality, dan stakeholder alignment." -------------------------------------------------------------------------------- /exercises/development/mobile/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 📱 Mobile Development – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun aplikasi mobile yang kompleks dengan advanced features, testing, dan deployment ke app stores. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat aplikasi mobile dengan fitur advanced (push notification, camera, location) 10 | - Menerapkan testing (unit, integration, E2E) untuk mobile apps 11 | - Mengelola deployment ke App Store dan Google Play 12 | - Mengoptimalkan performance dan memory usage 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Advanced Mobile Features | Push notification, camera, location| 21 | | 02 | Testing Mobile Apps | Jest, Detox, Appium | 22 | | 03 | App Store Deployment | App Store, Google Play, CI/CD| 23 | | 04 | Performance Optimization | Memory, battery, network | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file kode lengkap. 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - React Native/Flutter 32 | - Jest, Detox, Appium 33 | - Firebase, OneSignal 34 | - Fastlane, GitHub Actions 35 | - App Store Connect, Google Play Console 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/development/mobile/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── src/ 45 | ├── assets/ 46 | ├── tests/ 47 | └── deployment/ 48 | ``` 49 | 50 | --- 51 | 52 | ## 💬 Catatan untuk Mentor 53 | 54 | - Validasi hasil berdasarkan advanced features dan testing 55 | - Tanyakan alasan performance optimization dan deployment strategy 56 | - Dorong eksplorasi app store guidelines dan user experience 57 | 58 | --- 59 | 60 | > "Advanced mobile development membutuhkan pemahaman mendalam tentang platform, performance, dan user experience." 61 | -------------------------------------------------------------------------------- /exercises/business/business-analysis/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 📊 Business Analysis – Newcomer Level 2 | 3 | Level ini untuk pemula yang ingin mengenal dunia business analysis, dari requirements gathering hingga dokumentasi dasar. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami dasar business analysis dan BABOK framework 10 | - Melakukan requirements gathering dan stakeholder identification 11 | - Membuat dokumentasi requirements sederhana 12 | - Berkolaborasi dengan stakeholders dan tim IT 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Business Analysis Dasar | BABOK, requirements gathering| 21 | | 02 | Stakeholder Analysis | Identification, communication| 22 | | 03 | Requirements Documentation | User stories, acceptance criteria| 23 | | 04 | Process Mapping Sederhana | Current state, future state | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Draw.io, Lucidchart (process mapping) 32 | - Google Docs, Notion (dokumentasi) 33 | - Excel, Google Sheets (analysis) 34 | - Slack, Zoom (stakeholder communication) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/business-analysis/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── requirements/ 44 | ├── stakeholders/ 45 | ├── documentation/ 46 | └── process-maps/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan requirements clarity dan stakeholder alignment 54 | - Tanyakan alasan process mapping dan requirements prioritization 55 | - Dorong eksplorasi stakeholder communication dan documentation 56 | 57 | --- 58 | 59 | > "Business analysis dimulai dari pemahaman mendalam tentang kebutuhan bisnis dan stakeholder." -------------------------------------------------------------------------------- /exercises/business/strategy/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 🎯 Strategy – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam skill strategic analysis dengan competitive analysis, strategic planning, dan execution strategies. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Melakukan competitive analysis dan Porter's Five Forces 10 | - Mengembangkan strategic planning dan execution strategies 11 | - Menerapkan strategic frameworks lanjutan 12 | - Berkolaborasi dengan executive leadership untuk strategic decisions 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Competitive Analysis | Porter's Five Forces, positioning| 21 | | 02 | Strategic Planning | Balanced Scorecard, OKR | 22 | | 03 | Execution Strategy | Implementation, monitoring | 23 | | 04 | Strategic Communication | Executive presentation, alignment| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Advanced analysis tools 32 | - Strategic planning platforms 33 | - Executive presentation tools 34 | - Competitive intelligence tools 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/strategy/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── competitive-analysis/ 44 | ├── strategic-planning/ 45 | ├── execution/ 46 | └── communication/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan competitive analysis dan strategic planning 54 | - Tanyakan alasan strategic choices dan execution approach 55 | - Dorong eksplorasi executive communication dan stakeholder alignment 56 | 57 | --- 58 | 59 | > "Competitive analysis dan strategic planning adalah kunci strategy yang efektif dan executable." -------------------------------------------------------------------------------- /exercises/business/strategy/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 🎯 Strategy – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi strategic leader, mengembangkan corporate strategy, dan memimpin M&A serta executive leadership. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan corporate strategy dan enterprise strategy 10 | - Memimpin M&A activities dan strategic partnerships 11 | - Menerapkan executive leadership dalam strategic decision making 12 | - Berkontribusi pada thought leadership dalam strategic management 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Corporate Strategy | Enterprise strategy, governance| 21 | | 02 | M&A Strategy | Due diligence, integration | 22 | | 03 | Executive Leadership | C-level strategy, board communication| 23 | | 04 | Strategic Thought Leadership | Speaking, writing, innovation| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Enterprise strategy platforms 32 | - M&A due diligence tools 33 | - Executive presentation tools 34 | - Thought leadership platforms 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/strategy/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── corporate-strategy/ 44 | ├── m-a/ 45 | ├── executive-leadership/ 46 | └── thought-leadership/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan corporate strategy dan executive leadership 54 | - Tanyakan proses M&A dan strategic partnerships 55 | - Dorong eksplorasi thought leadership dan innovation 56 | 57 | --- 58 | 59 | > "Corporate strategy dan executive leadership adalah puncak perjalanan strategic management yang berdampak global." -------------------------------------------------------------------------------- /resources/tool-and-setup/figma.md: -------------------------------------------------------------------------------- 1 | # 🎨 Figma – Panduan Dasar Desain UI/UX Kolaboratif 2 | 3 | **Figma** adalah tool desain UI/UX berbasis web yang sangat populer untuk prototyping, wireframing, dan kolaborasi tim. 4 | 5 | --- 6 | 7 | ## 1️⃣ Pengenalan & Setup Akun 8 | - Daftar gratis di [https://figma.com](https://figma.com) 9 | - Bisa diakses via browser (tanpa install) atau install desktop app 10 | - Login dengan email Google lebih praktis 11 | 12 | --- 13 | 14 | ## 2️⃣ Fitur Utama Figma 15 | 16 | | Fitur | Fungsi & Manfaat | 17 | |---------------|-----------------------------------------------| 18 | | Frame/Artboard| Membuat layout untuk berbagai device | 19 | | Components | Membuat elemen reusable (button, card, dsb) | 20 | | Prototyping | Simulasi interaksi (klik, animasi, flow) | 21 | | Comment | Kolaborasi & feedback langsung di desain | 22 | | Plugin | Menambah fitur (icon, ilustrasi, dsb) | 23 | 24 | --- 25 | 26 | ## 3️⃣ Tips Kolaborasi 27 | - Undang tim via email untuk edit/komentar bareng 28 | - Gunakan fitur Version History untuk cek perubahan 29 | - Manfaatkan plugin untuk mempercepat workflow 30 | - Simpan style guide di satu file untuk konsistensi 31 | 32 | --- 33 | 34 | ## 4️⃣ Troubleshooting Umum 35 | - **Lambat?** Tutup tab lain, cek koneksi internet 36 | - **File tidak bisa diakses?** Pastikan sudah login dan punya akses 37 | - **Plugin error?** Update plugin atau reload Figma 38 | 39 | --- 40 | 41 | ## 5️⃣ FAQ 42 | 43 | **Q: Apakah Figma gratis?** 44 | A: Ya, untuk fitur dasar dan kolaborasi kecil. Ada versi Pro untuk tim besar. 45 | 46 | **Q: Bisa export ke format lain?** 47 | A: Bisa, ke PNG, JPG, SVG, PDF, dsb. 48 | 49 | **Q: Apakah Figma hanya untuk desain web?** 50 | A: Tidak, bisa untuk mobile, presentasi, ilustrasi, dsb. 51 | 52 | --- 53 | 54 | > "Figma memudahkan siapa saja untuk belajar dan berkolaborasi desain, tanpa perlu install software mahal!" -------------------------------------------------------------------------------- /exercises/business/product-management/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Management – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam skill product management dengan backlog management, prioritization, dan stakeholder management. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengelola product backlog dan sprint planning 10 | - Menerapkan teknik prioritization (RICE, MoSCoW, Kano) 11 | - Berkomunikasi dengan stakeholder dan tim cross-functional 12 | - Menggunakan analytics untuk data-driven decisions 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Backlog Management | User stories, acceptance criteria| 21 | | 02 | Prioritization Techniques | RICE, MoSCoW, Kano model | 22 | | 03 | Stakeholder Management | Communication, alignment, feedback| 23 | | 04 | Analytics & Data-driven PM | Metrics, KPIs, A/B testing | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Jira, Asana (backlog management) 32 | - Google Analytics, Mixpanel (analytics) 33 | - Notion, Confluence (dokumentasi) 34 | - Slack, Zoom (stakeholder communication) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/product-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── documentation/ 44 | ├── backlog/ 45 | ├── analytics/ 46 | └── stakeholder/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan prioritization dan stakeholder alignment 54 | - Tanyakan alasan teknik prioritization dan metrics choices 55 | - Dorong eksplorasi analytics dan data-driven decisions 56 | 57 | --- 58 | 59 | > "Prioritization yang baik adalah kunci product management yang efektif dan stakeholder alignment." -------------------------------------------------------------------------------- /exercises/business/product-management/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Management – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun product strategy, go-to-market plans, dan memimpin tim product development. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan product strategy dan go-to-market plans 10 | - Memimpin tim product development dan cross-functional teams 11 | - Menerapkan product-led growth dan user acquisition strategies 12 | - Mengelola product portfolio dan multiple products 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Product Strategy | Vision, mission, strategy | 21 | | 02 | Go-to-Market Planning | Launch strategy, marketing, sales| 22 | | 03 | Product-led Growth | User acquisition, retention, expansion| 23 | | 04 | Team Leadership | Cross-functional leadership, mentoring| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Aha!, Productboard (strategy) 32 | - Amplitude, Mixpanel (product analytics) 33 | - Notion, Confluence (dokumentasi) 34 | - Slack, Zoom (team leadership) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/product-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── strategy/ 44 | ├── go-to-market/ 45 | ├── analytics/ 46 | └── leadership/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan strategy dan go-to-market effectiveness 54 | - Tanyakan alasan product strategy dan growth tactics 55 | - Dorong eksplorasi team leadership dan cross-functional collaboration 56 | 57 | --- 58 | 59 | > "Product strategy dan go-to-market adalah kunci produk yang sukses di pasar yang kompetitif." -------------------------------------------------------------------------------- /exercises/business/product-management/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 📦 Product Management – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi product leader, mengembangkan product vision, dan memimpin organisasi product-driven. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan product vision dan growth strategy tingkat eksekutif 10 | - Memimpin organisasi product-driven dan product culture 11 | - Menerapkan advanced product analytics dan experimentation 12 | - Berkontribusi pada komunitas product management 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Product Vision & Strategy | Executive vision, long-term strategy| 21 | | 02 | Product Culture Leadership | Organizational leadership, culture| 22 | | 03 | Advanced Analytics | Experimentation, predictive analytics| 23 | | 04 | Community & Thought Leadership| Speaking, writing, mentoring| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Advanced analytics platforms 32 | - Executive presentation tools 33 | - Community platforms 34 | - Thought leadership platforms 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/product-management/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── vision/ 44 | ├── leadership/ 45 | ├── analytics/ 46 | └── community/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan executive vision dan organizational impact 54 | - Tanyakan proses thought leadership dan community building 55 | - Dorong eksplorasi advanced analytics dan experimentation 56 | 57 | --- 58 | 59 | > "Product leadership adalah tentang menciptakan vision yang menginspirasi dan memimpin organisasi menuju kesuksesan." -------------------------------------------------------------------------------- /exercises/business/strategy/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 🎯 Strategy – Builder Level 2 | 3 | Level ini untuk peserta yang ingin membangun business strategy, growth strategy, dan organizational transformation capabilities. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan business strategy dan growth strategy 10 | - Menerapkan organizational transformation dan change management 11 | - Memimpin strategic initiatives dan cross-functional projects 12 | - Mengelola strategic portfolio dan multiple business units 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Business Strategy | Corporate strategy, business model| 21 | | 02 | Growth Strategy | Market expansion, diversification| 22 | | 03 | Organizational Transformation| Change management, culture | 23 | | 04 | Strategic Portfolio Management| Multiple businesses, portfolio optimization| 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Strategic planning platforms 32 | - Business model canvas tools 33 | - Change management tools 34 | - Portfolio management tools 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/strategy/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── business-strategy/ 44 | ├── growth-strategy/ 45 | ├── transformation/ 46 | └── portfolio/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan business strategy dan growth effectiveness 54 | - Tanyakan alasan transformation approach dan portfolio choices 55 | - Dorong eksplorasi organizational change dan strategic execution 56 | 57 | --- 58 | 59 | > "Business strategy dan organizational transformation adalah kunci sustainable growth dan competitive advantage." -------------------------------------------------------------------------------- /exercises/business/business-analysis/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 📊 Business Analysis – Explorer Level 2 | 3 | Level ini untuk peserta yang ingin memperdalam skill business analysis dengan process modeling, stakeholder management, dan advanced documentation. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat process models dan business process analysis 10 | - Mengelola stakeholder relationships dan communication 11 | - Membuat advanced documentation dan specifications 12 | - Menerapkan business analysis techniques lanjutan 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Process Modeling | BPMN, flowcharts, swimlanes | 21 | | 02 | Stakeholder Management | RACI matrix, communication plan| 22 | | 03 | Advanced Documentation | BRD, FRD, use cases | 23 | | 04 | Business Analysis Techniques | SWOT, PESTLE, gap analysis | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Lucidchart, Draw.io (advanced modeling) 32 | - Confluence, Notion (advanced documentation) 33 | - Excel, Power BI (analysis) 34 | - Jira, Azure DevOps (requirements management) 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/business-analysis/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── process-models/ 44 | ├── stakeholders/ 45 | ├── documentation/ 46 | └── analysis/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan process modeling dan stakeholder management 54 | - Tanyakan alasan analysis techniques dan documentation choices 55 | - Dorong eksplorasi advanced modeling dan analysis methods 56 | 57 | --- 58 | 59 | > "Process modeling dan stakeholder management adalah kunci business analysis yang efektif." -------------------------------------------------------------------------------- /exercises/business/business-analysis/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 📊 Business Analysis – Innovator Level 2 | 3 | Level ini untuk peserta yang ingin menjadi strategic business analyst, mengembangkan enterprise architecture, dan memimpin organizational transformation. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan strategic business analysis dan enterprise architecture 10 | - Memimpin organizational transformation dan digital initiatives 11 | - Menerapkan innovation dalam business analysis methodologies 12 | - Berkontribusi pada komunitas business analysis 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|------------------------------| 20 | | 01 | Strategic Business Analysis | Enterprise strategy, innovation| 21 | | 02 | Enterprise Architecture | Architecture design, governance| 22 | | 03 | Digital Transformation | Digital initiatives, innovation| 23 | | 04 | Community & Thought Leadership| Speaking, writing, mentoring | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan file dokumentasi (PDF/Notion). 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Enterprise architecture platforms 32 | - Digital transformation tools 33 | - Innovation platforms 34 | - Community platforms 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/business/business-analysis/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── strategic-analysis/ 44 | ├── enterprise-architecture/ 45 | ├── digital-transformation/ 46 | └── community/ 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan strategic analysis dan enterprise architecture 54 | - Tanyakan proses digital transformation dan innovation 55 | - Dorong eksplorasi thought leadership dan community building 56 | 57 | --- 58 | 59 | > "Strategic business analysis adalah tentang memimpin organizational transformation dan innovation." -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/04/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🌳 FUNDAMENTAL – MVC Structure in Backend 2 | 3 | Arsitektur **MVC (Model-View-Controller)** adalah pola desain yang memisahkan aplikasi menjadi tiga bagian utama agar lebih terstruktur, scalable, dan mudah di-maintain. 4 | 5 | --- 6 | 7 | ## 🏗️ Apa Itu MVC? 8 | 9 | - **Model**: Mengelola data dan query ke database 10 | - **View**: (Pada API, biasanya tidak digunakan, tapi bisa untuk response format) 11 | - **Controller**: Logic bisnis, validasi, dan mengatur alur data 12 | - **Router**: (Tambahan di Express) Menangani endpoint dan arahkan ke controller 13 | 14 | --- 15 | 16 | ## 🧱 Struktur Folder MVC di Node.js 17 | 18 | ``` 19 | project/ 20 | ├── app.js 21 | ├── models/ 22 | ├── controllers/ 23 | ├── routes/ 24 | ├── db/ 25 | ├── utils/ 26 | ``` 27 | 28 | - **models/**: Query DB, relasi, schema 29 | - **controllers/**: Logic endpoint, validasi, error handling 30 | - **routes/**: Definisi endpoint dan middleware 31 | - **utils/**: Helper (format response, error, dsb.) 32 | - **db/**: File database atau migrasi 33 | 34 | --- 35 | 36 | ## 💡 Manfaat MVC 37 | 38 | - Kode lebih modular dan mudah di-maintain 39 | - Kolaborasi tim lebih efisien 40 | - Mudah testing/unit test 41 | - Siap untuk scaling dan penambahan fitur 42 | 43 | --- 44 | 45 | ## 🔧 Contoh Routing ke Controller 46 | 47 | ```js 48 | // routes/notes.js 49 | const express = require('express'); 50 | const router = express.Router(); 51 | const notesController = require('../controllers/notesController'); 52 | 53 | router.get('/', notesController.getAllNotes); 54 | router.post('/', notesController.createNote); 55 | // dst. 56 | 57 | module.exports = router; 58 | ``` 59 | 60 | --- 61 | 62 | ## 🔗 Referensi 63 | - [MVC Pattern](https://developer.mozilla.org/en-US/docs/Glossary/MVC) 64 | - [Express.js Project Structure](https://zellwk.com/blog/structure-node-js/) 65 | - [Knex.js Docs](https://knexjs.org/) 66 | 67 | --- 68 | 69 | > "MVC bukan sekadar pola, tapi budaya kerja tim backend modern." -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/04/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 04: Usability Testing & Iterasi 🔄 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🧭 Explorer 6 | > **Estimated Time**: 2–3 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Melakukan usability testing sederhana pada desain/wireframe 13 | - Mengumpulkan feedback user dan menganalisis hasilnya 14 | - Melakukan iterasi/perbaikan desain berdasarkan temuan 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu sudah membuat wireframe/prototype untuk fitur baru. Sebelum lanjut ke desain final, lakukan usability testing ke beberapa user untuk menemukan masalah dan peluang perbaikan. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Pilih wireframe/prototype yang sudah dibuat (dari latihan sebelumnya) 27 | 2. Lakukan usability testing ke minimal 2 user (bisa remote) 28 | 3. Catat feedback, masalah, dan saran user 29 | 4. Iterasi/perbaiki desain berdasarkan temuan 30 | 5. Dokumentasikan proses dan hasil di README.md 31 | 32 | --- 33 | 34 | ## ✨ Bonus Challenge 35 | 36 | - Rekam video testing (screen recording) 37 | - Buat tabel temuan & prioritas perbaikan 38 | - Uji ulang setelah iterasi kedua 39 | 40 | --- 41 | 42 | ## 📁 Struktur Folder 43 | 44 | ``` 45 | 04-usability-testing-iterasi/ 46 | ├── README.md 47 | ├── fundamental.md 48 | ├── feedback.txt / .pdf 49 | ├── iterasi-1.fig / .png 50 | └── video-testing.mp4 (opsional) 51 | ``` 52 | 53 | --- 54 | 55 | ## ✅ Submission Format 56 | 57 | ``` 58 | submissions/design/uiux/[username]/04-usability-testing-iterasi/ 59 | ``` 60 | 61 | --- 62 | 63 | ## 🔗 Referensi 64 | - [NNG – Usability Testing](https://www.nngroup.com/articles/usability-testing-101/) 65 | - [Figma – Prototype Testing](https://help.figma.com/hc/en-us/articles/360040451373-Create-prototypes-in-Figma) 66 | - [Usability.gov – Testing](https://www.usability.gov/how-to-and-tools/methods/usability-testing.html) 67 | 68 | --- 69 | 70 | > "Iterasi dan testing adalah kunci desain yang benar-benar usable dan berdampak nyata." -------------------------------------------------------------------------------- /exercises/development/backend/03-builder/03/fundamental.md: -------------------------------------------------------------------------------- 1 | # 🌳 FUNDAMENTAL – Relational Data & SQL Joins 2 | 3 | Aplikasi modern hampir selalu membutuhkan relasi antar data. Di level Builder, kamu akan belajar membangun dan meng-query relasi tersebut di database. 4 | 5 | --- 6 | 7 | ## 🔗 Apa Itu Relasi Database? 8 | 9 | - **Relasi 1:N**: Satu user punya banyak notes (user_id di notes) 10 | - **Relasi M:N**: Banyak notes bisa punya banyak tag (tabel pivot: note_tags) 11 | - **Foreign Key**: Kolom yang menghubungkan dua tabel 12 | 13 | --- 14 | 15 | ## 🧱 Membuat Relasi di SQLite 16 | 17 | - Tambahkan kolom `user_id` di tabel `notes` 18 | - Aktifkan foreign key constraint di SQLite 19 | - Contoh: 20 | 21 | ```sql 22 | CREATE TABLE users ( 23 | id INTEGER PRIMARY KEY AUTOINCREMENT, 24 | name TEXT, 25 | email TEXT 26 | ); 27 | 28 | CREATE TABLE notes ( 29 | id INTEGER PRIMARY KEY AUTOINCREMENT, 30 | user_id INTEGER, 31 | title TEXT, 32 | content TEXT, 33 | FOREIGN KEY(user_id) REFERENCES users(id) 34 | ); 35 | ``` 36 | 37 | --- 38 | 39 | ## 🔄 Query Join 40 | 41 | - **Inner Join**: Mengambil data dari dua tabel yang saling berelasi 42 | 43 | ```sql 44 | SELECT users.name, notes.title 45 | FROM users 46 | JOIN notes ON users.id = notes.user_id; 47 | ``` 48 | 49 | - Nested response: Gabungkan data user dan notes dalam satu response JSON 50 | 51 | --- 52 | 53 | ## 🛡️ Validasi & Error Handling 54 | 55 | - Pastikan user_id valid sebelum insert note 56 | - Tangani error jika relasi tidak ditemukan 57 | 58 | --- 59 | 60 | ## 💡 Tips 61 | 62 | - Gunakan index pada kolom foreign key untuk optimasi 63 | - Pisahkan logic relasi ke model/helper terpisah 64 | - Cek referensi integrity sebelum delete user 65 | 66 | --- 67 | 68 | ## 🔗 Referensi 69 | - [SQLite Foreign Key](https://www.sqlitetutorial.net/sqlite-foreign-key/) 70 | - [SQL JOIN](https://www.sqlitetutorial.net/sqlite-inner-join/) 71 | - [Knex.js Relations](https://knexjs.org/guide/relations.html) 72 | 73 | --- 74 | 75 | > "Relasi dan join = pondasi aplikasi multi-user dan data kompleks." -------------------------------------------------------------------------------- /exercises/data/machine-learning/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🤖 Machine Learning – Newcomer Level 2 | 3 | Selamat datang di level **Newcomer** untuk jalur Machine Learning! Di level ini, kamu akan mengenal dasar-dasar machine learning, algoritma sederhana, dan konsep fundamental dalam AI. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengenal konsep dasar machine learning dan AI 10 | - Belajar algoritma ML sederhana (linear regression, classification) 11 | - Memahami data preprocessing dan feature engineering 12 | - Melakukan model evaluation dasar 13 | - Mengembangkan mindset ML dan AI 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | Konsep Dasar Machine Learning | Supervised vs unsupervised, overfitting | 22 | | 02 | Linear Regression Sederhana | Regression, model training, evaluation | 23 | | 03 | Classification dengan Decision Tree | Classification, accuracy, confusion matrix| 24 | | 04 | Mini Project: House Price Prediction | End-to-end ML project | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan menggunakan scikit-learn. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - Python (scikit-learn, pandas, numpy) 33 | - Jupyter Notebook 34 | - Sample datasets (CSV, JSON) 35 | - Git untuk version control 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/data/machine-learning/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── REFLECTION.md 45 | ├── notebook.ipynb 46 | └── model/ (opsional) 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan model performance, bukan hanya kode 54 | - Tanyakan interpretasi model dan business impact 55 | - Dorong penggunaan best practices dalam ML 56 | 57 | --- 58 | 59 | > "Machine Learning adalah seni membuat komputer belajar dari data tanpa diprogram secara eksplisit." 🤖 -------------------------------------------------------------------------------- /exercises/design/uiux/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🪄 UI/UX Design – Newcomer Level 2 | 3 | > Level ini ditujukan untuk peserta yang baru mengenal dunia desain UI/UX. Fokus latihan adalah membentuk dasar berpikir desain, mengenal tools, dan memahami struktur visual yang baik. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Memahami perbedaan UI dan UX 10 | - Mengenal dasar desain visual: layout, warna, tipografi 11 | - Melatih kemampuan observasi dan kritik desain 12 | - Mampu membuat wireframe dan moodboard awal 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus | 19 | |-----|--------------------------------------|-------------------------------------------| 20 | | 01 | UI vs UX – Konsep dan Studi Visual | Observasi, analisis, mindset desain | 21 | | 02 | Layout & Visual Hierarchy | Susunan konten, grid, prioritas visual | 22 | | 03 | Color, Typography & Branding | Teori warna, konsistensi, tone & voice | 23 | | 04 | Wireframe Dasar: Homepage | Rancang halaman awal dengan pendekatan UX | 24 | 25 | > Semua latihan disertai `README.md` + `fundamental.md`, dan bisa dilengkapi dengan file desain via Figma/Whimsical. 26 | 27 | --- 28 | 29 | ## 🛠 Tools yang Digunakan 30 | 31 | - Figma (utama) 32 | - Whimsical / Miro (alternatif wireframe) 33 | - Google Fonts 34 | - Fontpair.co / Coolors.co / Paletton 35 | 36 | --- 37 | 38 | ## ✅ Submission Format 39 | 40 | ``` 41 | submissions/design/ui-ux/[username]/[exercise-folder]/ 42 | ├── README.md 43 | ├── REFLECTION.md 44 | ├── draft.png / .fig 45 | └── link_figma.txt (optional) 46 | ``` 47 | 48 | --- 49 | 50 | ## 💬 Catatan untuk Mentor 51 | 52 | - Validasi hasil berdasarkan prinsip, bukan selera pribadi 53 | - Tanyakan alasan di balik pilihan visual peserta 54 | - Dorong penggunaan referensi profesional dan dokumentasi desain 55 | 56 | --- 57 | 58 | > "Desain bukan hanya soal estetika. Desain adalah cara berpikir untuk menyelesaikan masalah pengguna dengan efektif dan menyenangkan." 🎨 59 | 60 | -------------------------------------------------------------------------------- /submission/development/frontend/Felicitaz Grace Realita/newcomer/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | FELICITAZ GRACE #1 6 | 7 | 8 | 9 | 10 |
11 |

Felicitaz Grace Realita

12 |

Hi dear!

13 |

Kenalin nama aku Felicitaz Grace Realita, for short bisa panggil aku felic aja hehe. Aku merupakan salah satu mahasiswa Universitas Sriwijaya (Fakultas Ilmu Komputer-D3 Manajemen Informatika) yang berasal dari Lampung Barat, Lampung.Karena aku gatau lagi ngomong apa dan aku suka tempe, jadi kita bahas tempe aja ya? Setuju kan? Oke.

14 |

Kalian pasti tau makanan fermentasi dari kedelai itu ? Yap, itu Tempe. Tempe merupakan salah satu makanan khas Indonesia yang sekarang sudah terjual bahkan di luar negeri. Tempe merupakan kedelai yang di fermentasi dengan bantuan jamur Rhizopus oligosporus atau Rhizopus stolonifer. Kedelai yang direbus lalu dikasih ragi akan berhasil menjadi tempe apabila miselia (bagian jamur yang berwarna putih itu guys) berhasil merekatkan kedelai satu sama lain. Tempe itu sehat banget guys, aku suka sekali tempe. Rekor muri aku adalah pernah makan tempe satu bungkus yang belum dimasak!

15 |

Berhubung aku susah add photo tempenya kalian ngerjain soal aja ya dari aku! Check it out!

16 |
17 | 18 | 19 | 20 |
21 |

Sambil menjawab, aku ada beberapa hobi yang sering aku lakuin antara lain :

22 |
    23 |
  • Membaca novel
    • 24 |
  • Crochet
    • 25 |
  • Memakan tempe (half of my life)
    • 26 |
27 |

Udah ya guys sekian, ini tugas newcomer aku hehe!>< see ya

28 |
29 | 30 | 31 | 32 | 33 | Click here for more! 34 | -------------------------------------------------------------------------------- /exercises/data/data-science/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🔬 Data Science – Newcomer Level 2 | 3 | Selamat datang di level **Newcomer** untuk jalur Data Science! Di level ini, kamu akan mengenal dasar-dasar Python untuk data science, statistik deskriptif, dan data exploration techniques. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengenal Python untuk data science (pandas, numpy, matplotlib) 10 | - Belajar statistik deskriptif dan inferensial dasar 11 | - Melakukan data exploration dan cleaning 12 | - Membuat visualisasi data dengan Python 13 | - Mengembangkan mindset data science 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | Python Dasar untuk Data Science | Pandas, numpy, data manipulation | 22 | | 02 | Data Exploration & Cleaning | EDA, missing data, outliers | 23 | | 03 | Statistik Deskriptif dengan Python | Central tendency, dispersion, correlation | 24 | | 04 | Mini Project: Customer Analysis | End-to-end data science workflow | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan menggunakan Jupyter Notebook. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - Python (pandas, numpy, matplotlib, seaborn) 33 | - Jupyter Notebook 34 | - Sample datasets (CSV, JSON) 35 | - Git untuk version control 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/data/data-science/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── REFLECTION.md 45 | ├── notebook.ipynb 46 | └── data/ (opsional) 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan insight yang dihasilkan, bukan hanya kode 54 | - Tanyakan interpretasi statistik dan rekomendasi 55 | - Dorong penggunaan best practices dalam data science 56 | 57 | --- 58 | 59 | > "Data Science adalah kombinasi statistik, programming, dan domain knowledge untuk mengekstrak insight dari data." 🔬 -------------------------------------------------------------------------------- /exercises/data/analytics/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 📈 Analytics – Newcomer Level 2 | 3 | Selamat datang di level **Newcomer** untuk jalur Analytics! Di level ini, kamu akan mengenal dasar-dasar analisis data, statistik deskriptif, dan tools analisis data yang paling umum digunakan. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengenal konsep dasar analisis data dan statistik 10 | - Belajar menggunakan Excel/Google Sheets untuk analisis data 11 | - Membuat visualisasi data sederhana dan informatif 12 | - Mengembangkan mindset data-driven 13 | - Memahami KPI dan metrics dasar 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | Dasar Excel & Statistik Deskriptif | Excel functions, mean, median, mode | 22 | | 02 | Visualisasi Data Sederhana | Chart types, best practices, storytelling | 23 | | 03 | KPI & Metrics Dasar | Business metrics, tracking, reporting | 24 | | 04 | Mini Project: Sales Analysis | End-to-end analysis, insight generation | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan bisa dilengkapi dengan file data sample. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - Excel/Google Sheets (utama) 33 | - Sample datasets (CSV, Excel) 34 | - Chart tools (Excel charts, Google Charts) 35 | - Basic SQL (opsional) 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/data/analytics/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── REFLECTION.md 45 | ├── analysis.xlsx / .csv 46 | └── charts/ (opsional) 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan insight yang dihasilkan, bukan hanya teknik 54 | - Tanyakan interpretasi data dan rekomendasi bisnis 55 | - Dorong penggunaan best practices dalam visualisasi 56 | 57 | --- 58 | 59 | > "Analisis data dimulai dari pertanyaan yang tepat. Setiap angka punya cerita yang menunggu untuk ditemukan." 📊 -------------------------------------------------------------------------------- /exercises/data/business-intelligence/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 📊 Business Intelligence – Newcomer Level 2 | 3 | Selamat datang di level **Newcomer** untuk jalur Business Intelligence! Di level ini, kamu akan mengenal dasar-dasar BI tools, dashboard development, dan KPI tracking untuk bisnis. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengenal tools BI (Tableau, Power BI, Google Data Studio) 10 | - Belajar membuat visualisasi data yang informatif 11 | - Memahami KPI dan metrics bisnis 12 | - Mengembangkan dashboard sederhana 13 | - Mengembangkan mindset data-driven business 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | Dasar BI Tools & Visualisasi | Tableau/Power BI basics, chart types | 22 | | 02 | KPI & Metrics Tracking | Business metrics, dashboard design | 23 | | 03 | Dashboard Sederhana | Layout, interactivity, storytelling | 24 | | 04 | Mini Project: Sales Dashboard | End-to-end BI project | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan menggunakan BI tools. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - Tableau/Power BI/Google Data Studio 33 | - Excel/Google Sheets untuk data preparation 34 | - Sample business datasets 35 | - Presentation tools untuk storytelling 36 | 37 | --- 38 | 39 | ## ✅ Submission Format 40 | 41 | ``` 42 | submissions/data/business-intelligence/[username]/[exercise-folder]/ 43 | ├── README.md 44 | ├── REFLECTION.md 45 | ├── dashboard.twbx / .pbix 46 | └── presentation/ (opsional) 47 | ``` 48 | 49 | --- 50 | 51 | ## 💬 Catatan untuk Mentor 52 | 53 | - Validasi hasil berdasarkan business insight, bukan hanya teknik 54 | - Tanyakan interpretasi dashboard dan rekomendasi bisnis 55 | - Dorong penggunaan best practices dalam BI 56 | 57 | --- 58 | 59 | > "Business Intelligence adalah seni mengubah data menjadi insight yang dapat ditindaklanjuti untuk keputusan bisnis." 📊 -------------------------------------------------------------------------------- /exercises/development/mobile/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | 2 | Selamat datang di level Newcomer untuk jalur Frontend Development! Latihan-latihan di level ini dirancang untuk membantu kamu memahami dasar-dasar pengembangan web menggunakan HTML, CSS, dan JavaScript. Cocok untuk kamu yang benar-benar baru mulai atau ingin memperkuat fondasi. 3 | 4 | ## 🎯 Tujuan Level 5 | 6 | - Memahami struktur HTML 7 | - Menggunakan CSS untuk styling dasar 8 | - Mengenal JavaScript dan interaksi sederhana 9 | - Membiasakan diri dengan tools seperti CodePen, GitHub, dan browser devtools 10 | 11 | ## 🧪 Daftar Latihan 12 | 13 | | No. | Judul Latihan | Fokus Utama | 14 | | --- | ------------- | ----------- | 15 | | 01 |HTML Introduction | Struktur halaman dan elemen dasar | 16 | | 02 | CSS Basic Layout | Styling, warna, layout dasar | 17 | | 03 | JS Basic Interaction | Event, DOM, interaksi tombol | 18 | | 04 | Mini Landing Page | Proyek kecil gabungan HTML+CSS | 19 | 20 | > Setiap latihan bisa dikerjakan dalam 1–2 jam, tergantung kecepatan belajar masing-masing. 21 | 22 | ## 📦 Struktur Folder 23 | 24 | ``` 25 | frontend/ 26 | └── newcomer/ 27 | ├── exercise-01-html-intro/ 28 | ├── exercise-02-css-basic-layout/ 29 | ├── exercise-03-js-interaction-basics/ 30 | ├── exercise-04-mini-landing-page/ 31 | ├── fundametal.md 32 | └── README.md 33 | ``` 34 | 35 | ## ✅ Cara Kerja 36 | 37 | 1. **Pilih latihan** dan buka instruksinya 38 | 2. **Kerjakan di CodePen atau lokal** (VS Code) 39 | 3. **Simpan hasil** dalam GitHub folder pribadi kamu 40 | 4. **Ajukan untuk review** ke mentor atau teman komunitas 41 | 42 | 43 | 44 | ## 🎓 Setelah Lulus Level Ini... 45 | 46 | Kamu siap naik ke level **Explorer**, di mana kamu akan belajar responsive layout, manipulasi DOM yang lebih kompleks, dan pembuatan komponen sederhana. 47 | 48 | --- 49 | 50 | > "Membuat sesuatu dari nol adalah cara terbaik belajar. Jangan kejar kesempurnaan, kejar kemajuan." 💡 51 | 52 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/02/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 02: Konsumsi API & Data Fetching 🌐 2 | 3 | > **Track**: Development 4 | > **Specialty**: Frontend 5 | > **Level**: 🧱 Builder 6 | > **Estimated Time**: 2 jam 7 | > **Last Updated**: Juli 2025 8 | 9 | --- 10 | 11 | ## 🎯 Tujuan Pembelajaran 12 | 13 | - Mengambil data dari REST API menggunakan fetch/axios 14 | - Menampilkan data dinamis di komponen 15 | - Menangani loading, error, dan empty state 16 | - Memahami lifecycle dan useEffect di React 17 | 18 | --- 19 | 20 | ## 📖 Studi Kasus 21 | 22 | > Kamu akan membangun halaman dashboard yang menampilkan data dari API publik (misal: JSONPlaceholder, PokeAPI, dsb). Data harus di-fetch saat komponen mount dan ditampilkan secara dinamis. 23 | 24 | --- 25 | 26 | ## 🛠 Tools & Setup 27 | 28 | - Lanjutkan dari project exercise 01 29 | - Gunakan fetch API atau axios 30 | 31 | --- 32 | 33 | ## 🔧 Tugas Utama 34 | 35 | 1. Buat halaman baru (misal: `UsersPage` atau `PostsPage`) 36 | 2. Fetch data dari API publik di useEffect 37 | 3. Tampilkan data dalam bentuk list/table/card 38 | 4. Tampilkan loading indicator saat fetch 39 | 5. Tampilkan error message jika fetch gagal 40 | 6. Tampilkan pesan jika data kosong 41 | 42 | --- 43 | 44 | ## ✨ Bonus Challenge 45 | 46 | - Tambahkan fitur search/filter 47 | - Pagination sederhana 48 | - Gunakan custom hook untuk data fetching 49 | 50 | --- 51 | 52 | ## 📁 Struktur File 53 | 54 | ``` 55 | spa-starter/ 56 | ├── src/ 57 | │ ├── components/ 58 | │ ├── pages/ 59 | │ │ └── UsersPage.jsx 60 | │ ├── App.js 61 | │ └── ... 62 | ├── README.md 63 | └── fundamental.md 64 | ``` 65 | 66 | --- 67 | 68 | ## ✅ Submission 69 | 70 | ``` 71 | submissions/frontend/[username]/spa-starter/ 72 | ├── src/ 73 | ├── README.md 74 | └── REFLECTION.md 75 | ``` 76 | 77 | --- 78 | 79 | ## 🔗 Referensi 80 | - [React useEffect](https://react.dev/reference/react/useEffect) 81 | - [MDN Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) 82 | - [Axios Docs](https://axios-http.com/) 83 | 84 | --- 85 | 86 | > "Mengambil dan menampilkan data dari API adalah skill inti frontend modern." -------------------------------------------------------------------------------- /resources/tool-and-setup/business_tools.md: -------------------------------------------------------------------------------- 1 | # 💼 Business Tools Setup – Panduan Dasar Alat Bisnis Digital 2 | 3 | Panduan ini membantu kamu memilih dan setup tools digital untuk kolaborasi, manajemen proyek, dan produktivitas bisnis modern. 4 | 5 | --- 6 | 7 | ## 1️⃣ Tools Populer & Fungsinya 8 | 9 | | Tool | Fungsi Utama | 10 | |----------------|-------------------------------------| 11 | | Notion | Catatan, dokumentasi, database tim | 12 | | Google Workspace| Email, Drive, Docs, Sheets, Meet | 13 | | Trello | Manajemen tugas & kanban board | 14 | | Slack/Discord | Komunikasi tim, chat, channel | 15 | | Zoom/Meet | Video meeting, presentasi | 16 | 17 | --- 18 | 19 | ## 2️⃣ Setup & Tips Penggunaan 20 | 21 | ### a. Notion 22 | - Daftar gratis di [https://notion.so](https://notion.so) 23 | - Buat workspace, undang tim via email 24 | - Gunakan template: project tracker, docs, dsb. 25 | 26 | ### b. Google Workspace 27 | - Daftar akun Google (gratis) 28 | - Akses: Gmail, Drive, Docs, Sheets, Meet 29 | - Share file dengan link atau email 30 | 31 | ### c. Trello 32 | - Daftar di [https://trello.com](https://trello.com) 33 | - Buat board, tambahkan list & card tugas 34 | - Drag & drop card sesuai progres 35 | 36 | ### d. Slack/Discord 37 | - Daftar, buat server/workspace 38 | - Buat channel sesuai topik/tim 39 | - Gunakan bot/automation untuk reminder 40 | 41 | --- 42 | 43 | ## 3️⃣ Tips Kolaborasi 44 | - Gunakan satu tool utama untuk komunikasi (hindari tumpang tindih) 45 | - Simpan dokumen penting di cloud (Drive/Notion) 46 | - Atur permission akses file sesuai kebutuhan 47 | - Gunakan template untuk efisiensi 48 | 49 | --- 50 | 51 | ## 4️⃣ FAQ 52 | 53 | **Q: Semua tools gratis?** 54 | A: Ada versi gratis, fitur premium untuk tim besar 55 | 56 | **Q: Mana yang wajib?** 57 | A: Minimal: Google Workspace + 1 tool manajemen tugas (Trello/Notion) 58 | 59 | **Q: Bisa diakses di HP?** 60 | A: Ya, semua tools di atas punya aplikasi mobile 61 | 62 | --- 63 | 64 | > "Tools digital bisnis memudahkan kolaborasi, dokumentasi, dan produktivitas tim modern. Pilih yang sesuai kebutuhanmu!" -------------------------------------------------------------------------------- /exercises/development/backend/02-explorer/01/readme.md: -------------------------------------------------------------------------------- 1 | # Exercise 01: Express Starter & Routing 🚀 2 | 3 | > **Track**: Development\ 4 | > **Specialty**: Backend\ 5 | > **Level**: 🌿 Explorer\ 6 | > **Estimated Time**: 1 jam\ 7 | > **Last Updated**: Juli 2025 8 | 9 | --- 10 | 11 | ## 🎯 Tujuan Pembelajaran 12 | 13 | - Menginstal dan menjalankan Express.js 14 | - Membuat server pertama dengan Express 15 | - Menangani route dasar (`GET`, `POST`) 16 | - Memahami struktur request dan response 17 | 18 | --- 19 | 20 | ## 📖 Studi Kasus 21 | 22 | > Kamu adalah developer backend yang ditugaskan membuat API untuk menyambut pengguna dan menerima data nama. Ini adalah langkah awal sebelum membangun sistem REST API skala penuh. 23 | 24 | --- 25 | 26 | ## 🛠 Tools & Setup 27 | 28 | ```bash 29 | mkdir exercise-01-express-intro 30 | cd exercise-01-express-intro 31 | npm init -y 32 | npm install express 33 | ``` 34 | 35 | Buat file `index.js` 36 | 37 | --- 38 | 39 | ## 🔧 Tugas Utama 40 | 41 | 1. Jalankan server di port 3000 42 | 2. Buat route `GET /` → return JSON `{ message: "Welcome to Express" }` 43 | 3. Buat route `POST /hello` → menerima JSON `{ name: "Raka" }`, dan kembalikan `{ message: "Hello, Raka!" }` 44 | 4. Gunakan `express.json()` sebagai middleware 45 | 46 | --- 47 | 48 | ## ✨ Bonus Challenge 49 | 50 | - Tambahkan route `GET /ping?name=...` untuk menyapa via query param 51 | - Tambahkan `nodemon` untuk auto-reload saat coding 52 | - Tambahkan response time logger sederhana 53 | 54 | --- 55 | 56 | ## 📁 Struktur File 57 | 58 | ``` 59 | exercise-01-express-intro/ 60 | ├── index.js 61 | ├── README.md 62 | └── fundamental.md 63 | ``` 64 | 65 | --- 66 | 67 | ## ✅ Submission 68 | 69 | ``` 70 | submissions/backend/[username]/exercise-01-express-intro/ 71 | ├── index.js 72 | └── REFLECTION.md 73 | ``` 74 | 75 | --- 76 | 77 | ## 🔗 Referensi 78 | 79 | - [Express.js Getting Started](https://expressjs.com/en/starter/hello-world.html) 80 | - [MDN Query Params](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams) 81 | 82 | --- 83 | 84 | > "Langkah kecil pertama dengan Express akan membuka gerbang besar menuju API production-ready." 85 | 86 | -------------------------------------------------------------------------------- /exercises/operations/qa-testing/readme.md: -------------------------------------------------------------------------------- 1 | # 🧪 QA & Testing Track – Panduan Umum 2 | 3 | > Track **QA & Testing** fokus pada pengujian software, baik manual maupun otomatis, untuk memastikan kualitas, keamanan, dan reliability aplikasi. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track QA & Testing 8 | 9 | - Memahami prinsip dasar QA dan testing 10 | - Menguasai teknik manual testing dan automation 11 | - Membuat test case, bug report, dan test plan 12 | - Menggunakan tools automation (Selenium, Cypress, Jest) 13 | - Menerapkan CI/CD untuk testing otomatis 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar QA, manual testing, bug reporting | 22 | | Explorer | Automation basics, test frameworks, CI integration | 23 | | Builder | Advanced automation, performance & security testing | 24 | | Innovator | Test strategy, QA leadership, advanced CI/CD | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Manual Testing** – TestRail, Xray, Google Sheets 31 | - **Automation** – Selenium, Cypress, Playwright, Jest 32 | - **CI/CD** – GitHub Actions, Jenkins 33 | - **Bug Tracking** – Jira, GitHub Issues 34 | - **Performance** – JMeter, Lighthouse 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | qa-testing/ 42 | ├── 01-newcomer/ 43 | │ ├── 01/ 44 | │ ├── 02/ 45 | │ ├── 03/ 46 | │ ├── 04/ 47 | │ └── README.md 48 | ├── 02-explorer/ 49 | │ └── README.md 50 | ├── 03-builder/ 51 | │ └── README.md 52 | ├── 04-innovator/ 53 | │ └── README.md 54 | └── README.md 55 | ``` 56 | 57 | --- 58 | 59 | ## 🔗 Referensi Penting 60 | 61 | - [Selenium Docs](https://www.selenium.dev/documentation/) 62 | - [Cypress Docs](https://docs.cypress.io/) 63 | - [Jest Docs](https://jestjs.io/docs/getting-started) 64 | - [TestRail Guide](https://www.gurock.com/testrail/docs/) 65 | - [QA Best Practices](https://www.guru99.com/software-testing.html) 66 | 67 | --- 68 | 69 | > "Testing bukan hanya mencari bug, tapi memastikan software memberikan pengalaman terbaik untuk user." 70 | -------------------------------------------------------------------------------- /exercises/data/analytics/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 📈 Analytics – Builder Level 2 | 3 | Selamat datang di level **Builder** untuk jalur Analytics! Di level ini, kamu akan membangun skill analisis prediktif, A/B testing, dan dashboard yang siap produksi. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Menguasai predictive analytics dan forecasting 10 | - Melakukan A/B testing dan experimental design 11 | - Membuat dashboard yang siap produksi 12 | - Mengintegrasikan berbagai sumber data 13 | - Mengembangkan KPI framework yang robust 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | Predictive Analytics & Forecasting | Time series, regression, trend analysis | 22 | | 02 | A/B Testing & Experimental Design | Hypothesis testing, statistical significance| 23 | | 03 | Production Dashboard | Real-time data, automation, alerts | 24 | | 04 | Mini Project: Business Intelligence | End-to-end BI solution | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan menggunakan tools enterprise. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - Python (scikit-learn, statsmodels, pandas) 33 | - R (untuk statistik lanjutan) 34 | - Tableau/Power BI (enterprise) 35 | - SQL (advanced queries) 36 | - Git dan CI/CD untuk automation 37 | 38 | --- 39 | 40 | ## ✅ Submission Format 41 | 42 | ``` 43 | submissions/data/analytics/[username]/[exercise-folder]/ 44 | ├── README.md 45 | ├── REFLECTION.md 46 | ├── analysis.ipynb 47 | ├── dashboard.twbx / .pbix 48 | ├── models/ (predictive models) 49 | └── automation/ (scripts) 50 | ``` 51 | 52 | --- 53 | 54 | ## 💬 Catatan untuk Mentor 55 | 56 | - Validasi hasil berdasarkan business impact, bukan hanya teknik 57 | - Tanyakan interpretasi model dan rekomendasi strategis 58 | - Dorong penggunaan best practices dalam predictive analytics 59 | 60 | --- 61 | 62 | > "Level Builder adalah saatnya membangun solusi analytics yang scalable dan berdampak nyata pada bisnis." -------------------------------------------------------------------------------- /resources/tool-and-setup/node_npm.md: -------------------------------------------------------------------------------- 1 | # 📦 Node.js & NPM – Panduan Lengkap untuk Semua Kalangan 2 | 3 | **Node.js** adalah runtime JavaScript di luar browser, dan **NPM** adalah package manager untuk mengelola library JS. Keduanya penting untuk development modern, baik frontend maupun backend. 4 | 5 | --- 6 | 7 | ## 1️⃣ Instalasi Node.js & NPM 8 | - Download: [https://nodejs.org](https://nodejs.org) 9 | - Pilih versi **LTS** (Long-Term Support) untuk stabilitas 10 | - Ikuti petunjuk instalasi sesuai OS 11 | - Cek versi: `node -v` dan `npm -v` 12 | 13 | --- 14 | 15 | ## 2️⃣ Inisialisasi & Penggunaan Dasar 16 | 17 | ### a. Inisialisasi Proyek 18 | ```bash 19 | npm init -y 20 | ``` 21 | Akan membuat file `package.json` otomatis. 22 | 23 | ### b. Install Package 24 | ```bash 25 | npm install [nama-library] 26 | ``` 27 | Contoh: `npm install express` 28 | 29 | ### c. Menjalankan Script 30 | Tambahkan di `package.json`: 31 | ```json 32 | "scripts": { 33 | "start": "node index.js" 34 | } 35 | ``` 36 | Lalu jalankan: 37 | ```bash 38 | npm start 39 | ``` 40 | 41 | --- 42 | 43 | ## 3️⃣ Struktur Proyek Node Dasar 44 | ``` 45 | my-app/ 46 | ├── index.js 47 | ├── package.json 48 | ├── node_modules/ (otomatis) 49 | └── .gitignore (abaikan node_modules di Git) 50 | ``` 51 | 52 | --- 53 | 54 | ## 4️⃣ Troubleshooting Umum 55 | - **Gagal install package?** Cek koneksi internet, coba `npm cache clean --force` 56 | - **node_modules terlalu besar?** Jangan di-push ke GitHub, gunakan `.gitignore` 57 | - **Error versi Node/NPM?** Update ke versi terbaru dari website resmi 58 | 59 | --- 60 | 61 | ## 5️⃣ FAQ 62 | 63 | **Q: Apa bedanya Node.js dan NPM?** 64 | A: Node.js = runtime, NPM = package manager. 65 | 66 | **Q: Apakah wajib pakai NPM?** 67 | A: Untuk proyek JS modern, ya. Bisa juga pakai Yarn/PNPM, tapi NPM sudah cukup untuk pemula. 68 | 69 | **Q: Bagaimana install package global?** 70 | A: `npm install -g [nama]` (misal: `npm install -g nodemon`) 71 | 72 | **Q: Bagaimana update package?** 73 | A: `npm update [nama]` atau semua: `npm update` 74 | 75 | --- 76 | 77 | > "Node & NPM membuka gerbang ke ekosistem JavaScript modern. Kuasai ini, kamu akan lebih bebas bereksperimen!" -------------------------------------------------------------------------------- /exercises/development/fullstack/readme.md: -------------------------------------------------------------------------------- 1 | # 🌐 Fullstack Development Track – Panduan Umum 2 | 3 | > Track **Fullstack Development** fokus pada pengembangan aplikasi web lengkap dari frontend hingga backend, database, dan deployment. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track Fullstack 8 | 9 | - Menguasai frontend (HTML, CSS, JavaScript) dan backend (Node.js, Python, PHP) 10 | - Menerapkan database design dan API development 11 | - Mengintegrasikan frontend dan backend untuk aplikasi lengkap 12 | - Mengelola deployment dan hosting aplikasi 13 | - Berkolaborasi dengan tim design, DevOps, dan QA 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar frontend + backend, database, API sederhana | 22 | | Explorer | Framework (React/Vue, Express/Django), deployment | 23 | | Builder | Advanced fullstack, authentication, real project | 24 | | Innovator | Architecture, microservices, cloud, team leadership | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Frontend**: HTML, CSS, JavaScript, React/Vue 31 | - **Backend**: Node.js, Python (Django/Flask), PHP 32 | - **Database**: MySQL, PostgreSQL, MongoDB 33 | - **Deployment**: Heroku, Vercel, AWS, Docker 34 | - **Version Control**: Git, GitHub 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | fullstack/ 42 | ├── 01-newcomer/ 43 | │ ├── 01/ 44 | │ ├── 02/ 45 | │ ├── 03/ 46 | │ ├── 04/ 47 | │ └── README.md 48 | ├── 02-explorer/ 49 | │ └── README.md 50 | ├── 03-builder/ 51 | │ └── README.md 52 | ├── 04-innovator/ 53 | │ └── README.md 54 | └── README.md 55 | ``` 56 | 57 | --- 58 | 59 | ## 🔗 Referensi Penting 60 | 61 | - [MDN Web Docs](https://developer.mozilla.org/) 62 | - [Node.js Documentation](https://nodejs.org/docs/) 63 | - [React Documentation](https://react.dev/) 64 | - [Django Documentation](https://docs.djangoproject.com/) 65 | - [Heroku Dev Center](https://devcenter.heroku.com/) 66 | 67 | --- 68 | 69 | > "Fullstack developer adalah jembatan antara frontend dan backend, memahami keseluruhan arsitektur aplikasi." -------------------------------------------------------------------------------- /code_of_conduct.md: -------------------------------------------------------------------------------- 1 | # 📜 Project-Link Community Code of Conduct 2 | 3 | Kami berkomitmen untuk menyediakan lingkungan komunitas yang ramah, inklusif, dan suportif bagi semua peserta, tanpa memandang latar belakang, gender, kemampuan, atau pengalaman. 4 | 5 | --- 6 | 7 | ## 🎯 Prinsip Utama 8 | 9 | Kami menjunjung tinggi nilai-nilai berikut: 10 | 11 | - **Ramah dan Saling Menghormati** – Semua peserta wajib memperlakukan satu sama lain dengan sopan dan empati. 12 | - **Inklusivitas** – Komunitas ini terbuka untuk siapa saja yang ingin belajar dan tumbuh. 13 | - **Kolaborasi Sehat** – Kita belajar bersama, bukan berkompetisi secara tidak sehat. 14 | - **Growth Mindset** – Tidak apa-apa tidak tahu. Yang penting adalah semangat untuk berkembang. 15 | 16 | --- 17 | 18 | ## 🚫 Perilaku yang Tidak Diperbolehkan 19 | 20 | Kami tidak menoleransi: 21 | 22 | - Pelecehan verbal atau visual dalam bentuk apapun 23 | - Komentar ofensif, diskriminatif, atau merendahkan 24 | - Ancaman, intimidasi, atau trolling 25 | - Spam, plagiarisme, atau penggunaan bahasa tidak pantas 26 | - Penyalahgunaan repositori (push/PR iseng, sabotase, dll) 27 | 28 | --- 29 | 30 | ## 📣 Cara Melapor 31 | 32 | Jika kamu mengalami atau menyaksikan pelanggaran, silakan segera laporkan kepada moderator melalui: 33 | - DM Discord: `@ProjectLink_Moderator` 34 | - Email: `report@projectlink.community` 35 | 36 | Kami akan menanggapi dengan cepat dan profesional, dengan menjaga privasi pelapor. 37 | 38 | --- 39 | 40 | ## 🛠️ Konsekuensi 41 | 42 | Pelanggaran terhadap kode etik ini dapat mengakibatkan: 43 | - Teguran atau peringatan resmi 44 | - Dikeluarkan dari proyek kolaboratif 45 | - Diblokir dari komunitas atau repositori 46 | - Pelaporan ke pihak terkait jika perlu 47 | 48 | --- 49 | 50 | ## 🤝 Komitmen Bersama 51 | 52 | Dengan bergabung dalam komunitas Project-Link, kamu menyatakan telah membaca dan siap mematuhi kode etik ini demi menciptakan ruang belajar yang aman, suportif, dan produktif untuk semua. 53 | 54 | --- 55 | 56 | > "Komunitas belajar yang sehat dibangun dari rasa saling percaya dan saling jaga. Kita semua bertanggung jawab menjaga atmosfer positif ini." 57 | 58 | — Tim Project-Link 🌱 59 | 60 | -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 🧭 UI/UX Design – Explorer Level 2 | 3 | Selamat datang di level **Explorer** untuk jalur UI/UX Design! Di level ini, kamu akan memperdalam pemahaman tentang user flow, wireframing, mobile-first design, dan riset pengguna. Latihan-latihan disusun untuk membangun skill praktis dan pola pikir desain yang lebih strategis. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat wireframe dan user flow untuk aplikasi nyata 10 | - Memahami prinsip mobile-first dan responsive design 11 | - Melakukan riset pengguna dasar (persona, interview, survey) 12 | - Mengembangkan solusi desain berbasis masalah nyata 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|---------------------------------------------| 20 | | 01 | User Flow & Journey Mapping | Alur pengguna, mapping kebutuhan, pain point| 21 | | 02 | Wireframing Mobile-First | Wireframe responsif, mobile-first thinking | 22 | | 03 | User Persona & Interview | Riset pengguna, persona, analisis kebutuhan | 23 | | 04 | Usability Testing & Iterasi | Uji coba desain, feedback, iterasi solusi | 24 | 25 | > Semua latihan disusun progresif. Disarankan dikerjakan berurutan. 26 | 27 | --- 28 | 29 | ## 🛠 Tools Wajib 30 | 31 | - Figma (utama) 32 | - Whimsical / Miro (alternatif mapping) 33 | - Google Forms / Typeform (survey) 34 | - Notion / Google Docs (dokumentasi) 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | explorer/ 42 | ├── 01/ 43 | ├── 02/ 44 | ├── 03/ 45 | ├── 04/ 46 | └── README.md 47 | ``` 48 | 49 | --- 50 | 51 | ## 🔗 Referensi Pendukung 52 | 53 | - [Figma Education](https://help.figma.com/hc/en-us/categories/360002051613-Learn-Figma) 54 | - [UX Journey Mapping](https://www.nngroup.com/articles/customer-journey-mapping/) 55 | - [Usability.gov – User Research](https://www.usability.gov/) 56 | - [Material Design Guidelines](https://m3.material.io/) 57 | 58 | --- 59 | 60 | > "Level Explorer adalah saatnya berpikir sebagai problem solver: memahami user, memetakan masalah, dan menguji solusi desain secara nyata." 61 | -------------------------------------------------------------------------------- /exercises/data/analytics/01-newcomer/03/readme.md: -------------------------------------------------------------------------------- 1 | # Exercise 03: KPI & Metrics Dasar 📈 2 | 3 | > **Track**: Data & Analytics 4 | > **Specialty**: Analytics 5 | > **Level**: 🌱 Newcomer 6 | > **Estimated Time**: 1.5–2 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Memahami konsep KPI dan metrics bisnis 13 | - Belajar menghitung dan melacak metrics penting 14 | - Membuat dashboard KPI sederhana 15 | - Mengembangkan kemampuan reporting bisnis 16 | 17 | --- 18 | 19 | ## 📖 Studi Kasus 20 | 21 | > Kamu adalah analyst di startup SaaS yang diminta membuat sistem tracking KPI untuk tim sales dan marketing. Kamu perlu mengidentifikasi metrics yang penting dan membuat dashboard untuk monitoring. 22 | 23 | --- 24 | 25 | ## 📚 Tugas Utama 26 | 27 | 1. Identifikasi KPI untuk bisnis SaaS: 28 | - Customer Acquisition Cost (CAC) 29 | - Customer Lifetime Value (CLV) 30 | - Monthly Recurring Revenue (MRR) 31 | - Churn Rate 32 | - Conversion Rate 33 | 34 | 2. Buat spreadsheet untuk tracking KPI: 35 | - Formula untuk menghitung setiap metric 36 | - Target dan actual values 37 | - Trend analysis sederhana 38 | 39 | 3. Buat dashboard KPI dengan: 40 | - Summary metrics 41 | - Trend charts 42 | - Alert system sederhana 43 | 44 | 4. Tulis rekomendasi berdasarkan KPI 45 | 46 | --- 47 | 48 | ## ✨ Bonus Challenge 49 | 50 | - Tambahkan forecasting sederhana 51 | - Buat automated alerts 52 | - Integrasi dengan Google Analytics 53 | 54 | --- 55 | 56 | ## 📁 Struktur Folder 57 | 58 | ``` 59 | exercise-03-kpi-metrics/ 60 | ├── README.md 61 | ├── fundamental.md 62 | ├── kpi_tracker.xlsx 63 | ├── dashboard.twbx 64 | └── recommendations.md 65 | ``` 66 | 67 | --- 68 | 69 | ## ✅ Submission Format 70 | 71 | ``` 72 | submissions/data/analytics/[username]/exercise-03-kpi-metrics/ 73 | ``` 74 | 75 | --- 76 | 77 | ## 🔗 Referensi 78 | 79 | - [KPI Framework](https://www.klipfolio.com/resources/kpi-examples) 80 | - [SaaS Metrics](https://www.forentrepreneurs.com/saas-metrics/) 81 | - [Dashboard Design](https://www.tableau.com/learn/whitepapers/dashboard-design) 82 | 83 | --- 84 | 85 | > "KPI yang tepat adalah kompas yang mengarahkan bisnis ke arah yang benar." -------------------------------------------------------------------------------- /exercises/design/uiux/02-explorer/02/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 02: Wireframing Mobile-First 📱 2 | 3 | > **Track**: Design 4 | > **Specialty**: UI/UX 5 | > **Level**: 🧭 Explorer 6 | > **Estimated Time**: 2–3 jam 7 | 8 | --- 9 | 10 | ## 🎯 Tujuan Latihan 11 | 12 | - Membuat wireframe low-fi untuk aplikasi mobile 13 | - Menerapkan prinsip mobile-first dan responsive design 14 | - Menyusun struktur konten dan navigasi yang efisien 15 | 16 | --- 17 | 18 | ## 📖 Studi Kasus 19 | 20 | > Kamu diminta mendesain ulang halaman utama aplikasi komunitas belajar. Fokus latihan ini adalah membuat wireframe mobile-first yang mudah digunakan, dengan navigasi jelas dan CTA menonjol. 21 | 22 | --- 23 | 24 | ## 📚 Tugas Utama 25 | 26 | 1. Analisa kebutuhan utama user di homepage aplikasi mobile 27 | 2. Buat wireframe low-fi (Figma/Whimsical) untuk: 28 | - Halaman utama (mobile) 29 | - Navigasi utama (tab bar/menu) 30 | - CTA utama (misal: "Gabung Komunitas") 31 | 3. Tambahkan anotasi pada wireframe: alasan penempatan elemen, urutan prioritas 32 | 4. Buat versi responsive (tablet/desktop) sebagai bonus 33 | 34 | --- 35 | 36 | ## ✨ Bonus Challenge 37 | 38 | - Uji wireframe ke 2–3 user, catat feedback 39 | - Buat flow wireframe untuk 2–3 halaman utama 40 | - Bandingkan dengan aplikasi sejenis (benchmark) 41 | 42 | --- 43 | 44 | ## 📁 Struktur Folder 45 | 46 | ``` 47 | 02-wireframing-mobile-first/ 48 | ├── README.md 49 | ├── fundamental.md 50 | ├── wireframe-mobile.fig / .png 51 | ├── wireframe-tablet.fig (opsional) 52 | └── notes.pdf / feedback.txt 53 | ``` 54 | 55 | --- 56 | 57 | ## ✅ Submission Format 58 | 59 | ``` 60 | submissions/design/uiux/[username]/02-wireframing-mobile-first/ 61 | ``` 62 | 63 | --- 64 | 65 | ## 🔗 Referensi 66 | - [Figma – Wireframing](https://help.figma.com/hc/en-us/articles/360040451373-Create-wireframes-in-Figma) 67 | - [Material Design – Layout](https://m3.material.io/foundations/layout/overview) 68 | - [Mobile-First Design](https://www.smashingmagazine.com/2011/07/mobile-first-a-presentation-by-luke-wroblewski/) 69 | 70 | --- 71 | 72 | > "Wireframe mobile-first adalah pondasi aplikasi modern: mulai dari kebutuhan utama user, bukan dari desktop dulu." -------------------------------------------------------------------------------- /exercises/development/frontend/01-newcomer/readme.md: -------------------------------------------------------------------------------- 1 | # 🧭 Frontend Development – Newcomer Level 2 | 3 | Selamat datang di level Newcomer untuk jalur Frontend Development! Latihan-latihan di level ini dirancang untuk membantu kamu memahami dasar-dasar pengembangan web menggunakan HTML, CSS, dan JavaScript. Cocok untuk kamu yang benar-benar baru mulai atau ingin memperkuat fondasi. 4 | 5 | ## 🎯 Tujuan Level 6 | 7 | - Memahami struktur HTML 8 | - Menggunakan CSS untuk styling dasar 9 | - Mengenal JavaScript dan interaksi sederhana 10 | - Membiasakan diri dengan tools seperti CodePen, GitHub, dan browser devtools 11 | 12 | ## 🧪 Daftar Latihan 13 | 14 | | No. | Judul Latihan | Fokus Utama | 15 | | --- | ------------- | ----------- | 16 | | 01 |HTML Introduction | Struktur halaman dan elemen dasar | 17 | | 02 | CSS Basic Layout | Styling, warna, layout dasar | 18 | | 03 | JS Basic Interaction | Event, DOM, interaksi tombol | 19 | | 04 | Mini Landing Page | Proyek kecil gabungan HTML+CSS | 20 | 21 | > Setiap latihan bisa dikerjakan dalam 1–2 jam, tergantung kecepatan belajar masing-masing. 22 | 23 | ## 📦 Struktur Folder 24 | 25 | ``` 26 | frontend/ 27 | └── newcomer/ 28 | ├── exercise-01-html-intro/ 29 | ├── exercise-02-css-basic-layout/ 30 | ├── exercise-03-js-interaction-basics/ 31 | ├── exercise-04-mini-landing-page/ 32 | ├── fundametal.md 33 | └── README.md 34 | ``` 35 | 36 | ## ✅ Cara Kerja 37 | 38 | 1. **Pilih latihan** dan buka instruksinya 39 | 2. **Kerjakan di CodePen atau lokal** (VS Code) 40 | 3. **Simpan hasil** dalam GitHub folder pribadi kamu 41 | 4. **Ajukan untuk review** ke mentor atau teman komunitas 42 | 43 | 44 | 45 | ## 🎓 Setelah Lulus Level Ini... 46 | 47 | Kamu siap naik ke level **Explorer**, di mana kamu akan belajar responsive layout, manipulasi DOM yang lebih kompleks, dan pembuatan komponen sederhana. 48 | 49 | --- 50 | 51 | > "Membuat sesuatu dari nol adalah cara terbaik belajar. Jangan kejar kesempurnaan, kejar kemajuan." 💡 52 | 53 | -------------------------------------------------------------------------------- /exercises/operations/infrastructure/readme.md: -------------------------------------------------------------------------------- 1 | # 🏗️ Infrastructure Track – Panduan Umum 2 | 3 | > Track **Infrastructure** fokus pada perancangan, deployment, dan pengelolaan infrastruktur IT modern, baik on-premise maupun cloud. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track Infrastructure 8 | 9 | - Memahami konsep dasar infrastruktur IT (server, jaringan, storage) 10 | - Menguasai deployment dan konfigurasi server 11 | - Menerapkan cloud infrastructure (IaaS, PaaS) 12 | - Mengelola keamanan, backup, dan monitoring 13 | - Menerapkan automation dan infrastructure as code 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar server, jaringan, storage, cloud intro | 22 | | Explorer | Deployment, konfigurasi, monitoring dasar | 23 | | Builder | Automation, scaling, backup, disaster recovery | 24 | | Innovator | Advanced cloud, hybrid infra, security, IaC | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Linux/Windows Server** – OS server 31 | - **Cloud** – AWS, GCP, Azure 32 | - **IaC** – Terraform, Ansible 33 | - **Monitoring** – Nagios, Zabbix, Prometheus 34 | - **Backup** – rsync, Veeam, cloud backup 35 | - **Networking** – Cisco, MikroTik, cloud networking 36 | 37 | --- 38 | 39 | ## 📦 Struktur Folder 40 | 41 | ``` 42 | infrastructure/ 43 | ├── 01-newcomer/ 44 | │ ├── 01/ 45 | │ ├── 02/ 46 | │ ├── 03/ 47 | │ ├── 04/ 48 | │ └── README.md 49 | ├── 02-explorer/ 50 | │ └── README.md 51 | ├── 03-builder/ 52 | │ └── README.md 53 | ├── 04-innovator/ 54 | │ └── README.md 55 | └── README.md 56 | ``` 57 | 58 | --- 59 | 60 | ## 🔗 Referensi Penting 61 | 62 | - [AWS Getting Started](https://aws.amazon.com/getting-started/) 63 | - [Linux Foundation Training](https://training.linuxfoundation.org/) 64 | - [Terraform Docs](https://developer.hashicorp.com/terraform/docs) 65 | - [Nagios Documentation](https://assets.nagios.com/downloads/nagioscore/docs/nagioscore/4/en/) 66 | 67 | --- 68 | 69 | > "Infrastruktur yang baik adalah fondasi dari sistem yang handal dan scalable." 70 | -------------------------------------------------------------------------------- /exercises/data/analytics/04-innovator/readme.md: -------------------------------------------------------------------------------- 1 | # 📈 Analytics – Innovator Level 2 | 3 | Selamat datang di level **Innovator** untuk jalur Analytics! Di level ini, kamu akan mengembangkan solusi analytics tingkat enterprise, data strategy, dan inovasi dalam analisis data. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Mengembangkan data strategy dan analytics roadmap 10 | - Membangun enterprise analytics solutions 11 | - Menerapkan advanced analytics dan AI/ML 12 | - Mengoptimalkan data infrastructure dan governance 13 | - Memimpin transformasi data-driven dalam organisasi 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | Data Strategy & Analytics Roadmap | Enterprise strategy, data governance | 22 | | 02 | Advanced Analytics & AI Integration | ML models, automation, predictive insights| 23 | | 03 | Enterprise Dashboard & Data Platform | Scalable solutions, real-time analytics | 24 | | 04 | Mini Project: Data-Driven Innovation | End-to-end enterprise analytics solution | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan menggunakan enterprise tools. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - Cloud platforms (AWS, GCP, Azure) 33 | - Enterprise BI tools (Tableau Server, Power BI Premium) 34 | - ML platforms (Databricks, SageMaker) 35 | - Data warehouses (Snowflake, BigQuery) 36 | - Orchestration tools (Airflow, dbt) 37 | 38 | --- 39 | 40 | ## ✅ Submission Format 41 | 42 | ``` 43 | submissions/data/analytics/[username]/[exercise-folder]/ 44 | ├── README.md 45 | ├── REFLECTION.md 46 | ├── strategy.md 47 | ├── architecture/ 48 | ├── models/ 49 | └── documentation/ 50 | ``` 51 | 52 | --- 53 | 54 | ## 💬 Catatan untuk Mentor 55 | 56 | - Validasi hasil berdasarkan strategic impact, bukan hanya teknik 57 | - Tanyakan business value dan ROI dari solusi 58 | - Dorong inovasi dan best practices enterprise 59 | 60 | --- 61 | 62 | > "Level Innovator adalah saatnya menjadi thought leader dalam analytics dan mendorong transformasi data-driven." -------------------------------------------------------------------------------- /exercises/operations/security/readme.md: -------------------------------------------------------------------------------- 1 | # 🔒 Security Track – Panduan Umum 2 | 3 | > Track **Security** fokus pada keamanan aplikasi, infrastruktur, dan data, serta best practices untuk mencegah, mendeteksi, dan merespons ancaman siber. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track Security 8 | 9 | - Memahami prinsip dasar keamanan siber 10 | - Menguasai teknik pengujian keamanan aplikasi dan jaringan 11 | - Menerapkan best practices untuk hardening dan incident response 12 | - Mengelola identitas, akses, dan compliance 13 | - Membangun budaya security awareness 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar keamanan, password, phishing, basic hardening | 22 | | Explorer | Vulnerability scanning, penetration testing, SAST | 23 | | Builder | Incident response, SIEM, advanced hardening | 24 | | Innovator | Security architecture, compliance, red/blue team | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Password Manager** – Bitwarden, LastPass 31 | - **Vulnerability Scanner** – Nessus, OpenVAS 32 | - **Penetration Testing** – Metasploit, Burp Suite 33 | - **SIEM** – Splunk, ELK Stack 34 | - **SAST/DAST** – SonarQube, OWASP ZAP 35 | - **Firewall & IDS/IPS** – pfSense, Snort 36 | 37 | --- 38 | 39 | ## 📦 Struktur Folder 40 | 41 | ``` 42 | security/ 43 | ├── 01-newcomer/ 44 | │ ├── 01/ 45 | │ ├── 02/ 46 | │ ├── 03/ 47 | │ ├── 04/ 48 | │ └── README.md 49 | ├── 02-explorer/ 50 | │ └── README.md 51 | ├── 03-builder/ 52 | │ └── README.md 53 | ├── 04-innovator/ 54 | │ └── README.md 55 | └── README.md 56 | ``` 57 | 58 | --- 59 | 60 | ## 🔗 Referensi Penting 61 | 62 | - [OWASP Top 10](https://owasp.org/www-project-top-ten/) 63 | - [Kali Linux Tools](https://tools.kali.org/tools-listing) 64 | - [NIST Cybersecurity Framework](https://www.nist.gov/cyberframework) 65 | - [Security Awareness Training](https://www.cyber.gov.au/acsc/view-all-content/programs/education-awareness) 66 | 67 | --- 68 | 69 | > "Security bukan hanya tools, tapi mindset dan budaya yang harus dibangun di setiap tim." 70 | -------------------------------------------------------------------------------- /exercises/design/user-research/readme.md: -------------------------------------------------------------------------------- 1 | # 🔍 User Research Track – Panduan Umum 2 | 3 | > Track **User Research** fokus pada riset kebutuhan, perilaku, dan pengalaman pengguna untuk menghasilkan solusi desain dan produk yang relevan dan berdampak. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track User Research 8 | 9 | - Memahami metode riset user (interview, survey, usability test) 10 | - Menguasai teknik analisis data kualitatif & kuantitatif 11 | - Membuat persona, journey map, dan insight user 12 | - Berkolaborasi dengan tim desain, produk, dan dev 13 | - Membangun portofolio riset user 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar riset user, interview, survey, persona | 22 | | Explorer | Journey mapping, usability test, analisis insight | 23 | | Builder | Advanced research, synthesis, riset kolaboratif | 24 | | Innovator | Research ops, leadership, sharing insight | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - [Google Forms/Typeform](https://forms.google.com) 31 | - [Figma](https://figma.com) (persona, journey map) 32 | - [Miro/Whimsical](https://miro.com) (mapping, affinity diagram) 33 | - [Notion/Google Docs](https://notion.so) (dokumentasi) 34 | - [Lookback/Zoom](https://lookback.io) (usability test) 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | user-research/ 42 | ├── 01-newcomer/ 43 | │ ├── 01/ 44 | │ ├── 02/ 45 | │ ├── 03/ 46 | │ ├── 04/ 47 | │ └── README.md 48 | ├── 02-explorer/ 49 | │ └── README.md 50 | ├── 03-builder/ 51 | │ └── README.md 52 | ├── 04-innovator/ 53 | │ └── README.md 54 | └── README.md 55 | ``` 56 | 57 | --- 58 | 59 | ## 🔗 Referensi Penting 60 | 61 | - [NNG – User Research](https://www.nngroup.com/topic/user-research/) 62 | - [IDEO Design Kit](https://www.designkit.org/methods) 63 | - [UXPressia – Persona & Journey Map](https://uxpressia.com/) 64 | - [Lookback – Usability Testing](https://lookback.io/) 65 | 66 | --- 67 | 68 | > "User research adalah fondasi desain dan produk yang benar-benar dibutuhkan dan dicintai user." 69 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/03/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 03: State Management & Context 🗂️ 2 | 3 | > **Track**: Development 4 | > **Specialty**: Frontend 5 | > **Level**: 🧱 Builder 6 | > **Estimated Time**: 2 jam 7 | > **Last Updated**: Juli 2025 8 | 9 | --- 10 | 11 | ## 🎯 Tujuan Pembelajaran 12 | 13 | - Mengelola state global dan lokal di React 14 | - Memahami lifting state, prop drilling, dan context 15 | - Membuat context provider untuk state global 16 | - Refactor komponen agar lebih scalable 17 | 18 | --- 19 | 20 | ## 📖 Studi Kasus 21 | 22 | > Kamu membangun aplikasi dashboard dengan fitur user login dan theme (dark/light). State user dan theme harus bisa diakses dari banyak komponen tanpa prop drilling berlebihan. 23 | 24 | --- 25 | 26 | ## 🛠 Tools & Setup 27 | 28 | - Lanjutkan dari project sebelumnya 29 | - Gunakan React Context API 30 | - Optional: Redux/Zustand 31 | 32 | --- 33 | 34 | ## 🔧 Tugas Utama 35 | 36 | 1. Buat context untuk user dan theme 37 | 2. Implementasi context provider di App.js 38 | 3. Gunakan context di beberapa komponen (Header, Main, dsb.) 39 | 4. Demonstrasikan lifting state dan prop drilling 40 | 5. Refactor agar state global mudah diakses 41 | 42 | --- 43 | 44 | ## ✨ Bonus Challenge 45 | 46 | - Persist state ke localStorage 47 | - Tambahkan toggle theme (dark/light) 48 | - Gunakan custom hook untuk context 49 | 50 | --- 51 | 52 | ## 📁 Struktur File 53 | 54 | ``` 55 | spa-starter/ 56 | ├── src/ 57 | │ ├── context/ 58 | │ │ └── UserContext.js 59 | │ │ └── ThemeContext.js 60 | │ ├── components/ 61 | │ ├── pages/ 62 | │ ├── App.js 63 | │ └── ... 64 | ├── README.md 65 | └── fundamental.md 66 | ``` 67 | 68 | --- 69 | 70 | ## ✅ Submission 71 | 72 | ``` 73 | submissions/frontend/[username]/spa-starter/ 74 | ├── src/ 75 | ├── README.md 76 | └── REFLECTION.md 77 | ``` 78 | 79 | --- 80 | 81 | ## 🔗 Referensi 82 | - [React Context](https://react.dev/reference/react/createContext) 83 | - [State Management Patterns](https://react.dev/learn/scaling-up-with-reducer-and-context) 84 | - [Redux](https://redux.js.org/) 85 | 86 | --- 87 | 88 | > "State global dan context = kunci aplikasi frontend yang scalable dan maintainable." -------------------------------------------------------------------------------- /exercises/design/graphic-design/readme.md: -------------------------------------------------------------------------------- 1 | # 🖼️ Graphic Design Track – Panduan Umum 2 | 3 | > Track **Graphic Design** fokus pada pengembangan skill visual, branding, ilustrasi, dan komunikasi visual untuk berbagai media digital maupun cetak. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track Graphic Design 8 | 9 | - Memahami prinsip dasar desain grafis (komposisi, warna, tipografi) 10 | - Menguasai tools desain populer (Adobe, Figma, Canva, dsb.) 11 | - Membuat karya visual: poster, logo, ilustrasi, social media 12 | - Membangun portofolio desain yang kuat 13 | - Berkolaborasi dengan tim produk, marketing, dan branding 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar desain grafis, tools, komposisi visual | 22 | | Explorer | Branding, ilustrasi, layout, color theory | 23 | | Builder | Advanced visual, mockup, portofolio, real project | 24 | | Innovator | Creative direction, art direction, design ops | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - [Adobe Photoshop](https://www.adobe.com/products/photoshop.html) 31 | - [Adobe Illustrator](https://www.adobe.com/products/illustrator.html) 32 | - [Figma](https://figma.com) 33 | - [Canva](https://canva.com) 34 | - [Procreate](https://procreate.com) (iPad) 35 | - [Google Fonts](https://fonts.google.com) 36 | 37 | --- 38 | 39 | ## 📦 Struktur Folder 40 | 41 | ``` 42 | graphic-design/ 43 | ├── 01-newcomer/ 44 | │ ├── 01/ 45 | │ ├── 02/ 46 | │ ├── 03/ 47 | │ ├── 04/ 48 | │ └── README.md 49 | ├── 02-explorer/ 50 | │ └── README.md 51 | ├── 03-builder/ 52 | │ └── README.md 53 | ├── 04-innovator/ 54 | │ └── README.md 55 | └── README.md 56 | ``` 57 | 58 | --- 59 | 60 | ## 🔗 Referensi Penting 61 | 62 | - [Canva Design School](https://www.canva.com/learn/design/) 63 | - [Adobe Tutorials](https://helpx.adobe.com/) 64 | - [Behance Inspiration](https://www.behance.net/) 65 | - [99Designs Guide](https://99designs.com/blog/) 66 | 67 | --- 68 | 69 | > "Desain grafis adalah seni menyampaikan pesan dan emosi melalui visual yang bermakna dan menarik." 70 | -------------------------------------------------------------------------------- /exercises/operations/devops/readme.md: -------------------------------------------------------------------------------- 1 | # ⚙️ DevOps Track – Panduan Umum 2 | 3 | > Track **DevOps** fokus pada integrasi development dan operations, otomatisasi, CI/CD, dan cloud infrastructure untuk pengembangan software modern. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track DevOps 8 | 9 | - Memahami prinsip DevOps dan budaya kolaborasi 10 | - Menguasai tools otomatisasi (CI/CD, container, cloud) 11 | - Menerapkan infrastructure as code (IaC) 12 | - Mengelola deployment, monitoring, dan scaling aplikasi 13 | - Meningkatkan keamanan dan reliability sistem 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar DevOps, version control, basic automation | 22 | | Explorer | CI/CD pipelines, containerization, cloud basics | 23 | | Builder | Infrastructure as Code, monitoring, scaling | 24 | | Innovator | Advanced DevOps, SRE, security, cloud architecture | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Git & GitHub/GitLab** – Version control & collaboration 31 | - **CI/CD** – GitHub Actions, GitLab CI, Jenkins 32 | - **Containers** – Docker, Kubernetes 33 | - **Cloud** – AWS, GCP, Azure 34 | - **IaC** – Terraform, Ansible 35 | - **Monitoring** – Prometheus, Grafana 36 | 37 | --- 38 | 39 | ## 📦 Struktur Folder 40 | 41 | ``` 42 | devops/ 43 | ├── 01-newcomer/ 44 | │ ├── 01/ 45 | │ ├── 02/ 46 | │ ├── 03/ 47 | │ ├── 04/ 48 | │ └── README.md 49 | ├── 02-explorer/ 50 | │ └── README.md 51 | ├── 03-builder/ 52 | │ └── README.md 53 | ├── 04-innovator/ 54 | │ └── README.md 55 | └── README.md 56 | ``` 57 | 58 | --- 59 | 60 | ## 🔗 Referensi Penting 61 | 62 | - [DevOps Handbook](https://itrevolution.com/devops-handbook/) 63 | - [Docker Docs](https://docs.docker.com/) 64 | - [Kubernetes Docs](https://kubernetes.io/docs/) 65 | - [Terraform Docs](https://developer.hashicorp.com/terraform/docs) 66 | - [CI/CD Concepts](https://www.redhat.com/en/topics/devops/what-is-ci-cd) 67 | 68 | --- 69 | 70 | > "DevOps adalah jembatan antara pengembangan dan operasional, mempercepat inovasi dan meningkatkan kualitas software." 71 | -------------------------------------------------------------------------------- /exercises/design/uiux/03-builder/readme.md: -------------------------------------------------------------------------------- 1 | # 🏗️ UI/UX Design – Builder Level 2 | 3 | Selamat datang di level **Builder** untuk jalur UI/UX Design! Di level ini, kamu akan membangun desain hi-fi, membuat design system sederhana, menguji aksesibilitas, dan melakukan handoff ke tim developer. Latihan-latihan disusun untuk membentuk skill desain siap produksi dan kolaborasi tim. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Membuat desain hi-fi (high fidelity) siap prototype 10 | - Membangun design system sederhana (komponen, style guide) 11 | - Menguji dan memperbaiki aksesibilitas desain 12 | - Melakukan handoff ke developer (spec, asset, dokumentasi) 13 | 14 | --- 15 | 16 | ## 📁 Daftar Exercise 17 | 18 | | No. | Judul Latihan | Fokus Utama | 19 | |-----|------------------------------|---------------------------------------------| 20 | | 01 | Hi-Fi Design & Prototyping | Desain detail, interaksi, prototype Figma | 21 | | 02 | Design System Starter | Komponen, style guide, konsistensi visual | 22 | | 03 | Accessibility Audit & Fix | Audit aksesibilitas, perbaikan desain inklusif| 23 | | 04 | Handoff & Developer Spec | Export asset, dokumentasi, kolaborasi dev | 24 | 25 | > Semua latihan disusun progresif. Disarankan dikerjakan berurutan. 26 | 27 | --- 28 | 29 | ## 🛠 Tools Wajib 30 | 31 | - Figma (utama) 32 | - Stark / Contrast Checker (aksesibilitas) 33 | - Notion / Google Docs (dokumentasi) 34 | - Zeplin / Figma Inspect (handoff) 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | builder/ 42 | ├── 01/ 43 | ├── 02/ 44 | ├── 03/ 45 | ├── 04/ 46 | └── README.md 47 | ``` 48 | 49 | --- 50 | 51 | ## 🔗 Referensi Pendukung 52 | 53 | - [Figma Prototyping](https://help.figma.com/hc/en-us/articles/360040451373-Create-prototypes-in-Figma) 54 | - [Design Systems Repo](https://designsystemsrepo.com/) 55 | - [Stark – Accessibility Tools](https://www.getstark.co/) 56 | - [Material Design Accessibility](https://m3.material.io/foundations/accessibility/overview) 57 | 58 | --- 59 | 60 | > "Level Builder adalah saatnya membangun desain siap produksi: detail, konsistensi, aksesibilitas, dan kolaborasi nyata dengan tim developer." 61 | -------------------------------------------------------------------------------- /exercises/design/uiux/readme.md: -------------------------------------------------------------------------------- 1 | # 🎨 UI/UX Design Track – Panduan Umum 2 | 3 | > Selamat datang di jalur **UI/UX Design** di Project-Link! Track ini dirancang untuk membantu kamu memahami dan mempraktikkan dasar-dasar desain antarmuka (UI) dan pengalaman pengguna (UX) yang relevan di dunia digital saat ini. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track UI/UX 8 | 9 | - Mengenal prinsip-prinsip dasar UI dan UX 10 | - Belajar tools desain populer seperti Figma 11 | - Menerapkan thinking proses seperti user journey dan wireframe 12 | - Merancang desain yang responsif, accessible, dan usable 13 | - Berkolaborasi lintas tim: frontend, product, dan QA 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar UI/UX, tools, mindset desain, visual hierarchy | 22 | | Explorer | Wireframing, user flow, mobile-first, research | 23 | | Builder | Hi-fi design, design system, accessibility, testing | 24 | | Innovator | UX strategy, end-to-end case study, design ops | 25 | 26 | > Semua level dilengkapi latihan praktis (exercise) dan skenario nyata (studi kasus). 27 | 28 | --- 29 | 30 | ## 🛠 Tools Utama 31 | 32 | - [Figma](https://figma.com) – Desain antarmuka & kolaborasi tim 33 | - Whimsical / Miro – Mindmapping, flowchart, wireframe kasar 34 | - Notion – Documentasi UX thinking dan tim insight 35 | - Fontsource / Google Fonts – Tipografi web 36 | 37 | --- 38 | 39 | ## 📦 Struktur Folder 40 | 41 | ``` 42 | design/ 43 | └── ui-ux/ 44 | ├── newcomer/ 45 | ├── explorer/ 46 | ├── builder/ 47 | ├── innovator/ 48 | └── README.md 49 | ``` 50 | 51 | --- 52 | 53 | ## 🔗 Referensi Penting 54 | 55 | - [Material Design](https://m3.material.io/) 56 | - [Apple HIG](https://developer.apple.com/design/human-interface-guidelines/) 57 | - [Laws of UX](https://lawsofux.com/) 58 | - [Figma Education](https://help.figma.com/hc/en-us/categories/360002051613-Learn-Figma) 59 | 60 | --- 61 | 62 | > "UI adalah bagaimana produk terlihat. UX adalah bagaimana produk terasa. Kombinasi keduanya menciptakan pengalaman yang bermakna dan efisien." 63 | 64 | -------------------------------------------------------------------------------- /exercises/business/strategy/readme.md: -------------------------------------------------------------------------------- 1 | # 🎯 Strategy Track – Panduan Umum 2 | 3 | > Track **Strategy** fokus pada pengembangan strategi bisnis, competitive analysis, dan strategic planning untuk mencapai tujuan organisasi jangka panjang. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track Strategy 8 | 9 | - Memahami competitive landscape dan market analysis 10 | - Mengembangkan business strategy dan strategic planning 11 | - Menerapkan strategic frameworks dan methodologies 12 | - Berkolaborasi dengan executive leadership dan stakeholders 13 | - Membangun portofolio strategic thinking 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar strategic thinking, market analysis, frameworks| 22 | | Explorer | Competitive analysis, strategic planning, execution | 23 | | Builder | Business strategy, growth strategy, transformation | 24 | | Innovator | Corporate strategy, M&A, executive leadership | 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Analysis**: Porter's Five Forces, SWOT, PESTLE 31 | - **Planning**: Balanced Scorecard, OKR, Strategy Maps 32 | - **Research**: Market research tools, competitive intelligence 33 | - **Presentation**: PowerPoint, Google Slides, Prezi 34 | - **Collaboration**: Miro, Notion, Microsoft Teams 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | strategy/ 42 | ├── 01-newcomer/ 43 | │ ├── 01/ 44 | │ ├── 02/ 45 | │ ├── 03/ 46 | │ ├── 04/ 47 | │ └── README.md 48 | ├── 02-explorer/ 49 | │ └── README.md 50 | ├── 03-builder/ 51 | │ └── README.md 52 | ├── 04-innovator/ 53 | │ └── README.md 54 | └── README.md 55 | ``` 56 | 57 | --- 58 | 59 | ## 🔗 Referensi Penting 60 | 61 | - [Harvard Business Review](https://hbr.org/) 62 | - [McKinsey Insights](https://www.mckinsey.com/insights) 63 | - [BCG Perspectives](https://www.bcg.com/perspectives) 64 | - [Strategy+Business](https://www.strategy-business.com/) 65 | - [MIT Sloan Management Review](https://sloanreview.mit.edu/) 66 | 67 | --- 68 | 69 | > "Strategy adalah seni dan sains menciptakan competitive advantage dan mencapai sustainable growth." -------------------------------------------------------------------------------- /exercises/development/mobile/readme.md: -------------------------------------------------------------------------------- 1 | # 📱 Mobile Development Track – Panduan Umum 2 | 3 | > Track **Mobile Development** fokus pada pengembangan aplikasi mobile untuk iOS dan Android menggunakan native, cross-platform, dan hybrid approaches. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Track Mobile Development 8 | 9 | - Menguasai pengembangan aplikasi mobile (iOS/Android) 10 | - Menerapkan UI/UX mobile yang responsif dan accessible 11 | - Mengintegrasikan dengan backend dan third-party services 12 | - Mengelola deployment ke App Store dan Google Play 13 | - Berkolaborasi dengan tim design, backend, dan QA 14 | 15 | --- 16 | 17 | ## 🧭 Level Pembelajaran 18 | 19 | | Level | Fokus Pembelajaran | 20 | | --------- | ---------------------------------------------------- | 21 | | Newcomer | Dasar mobile dev, UI components, navigation | 22 | | Explorer | State management, API integration, local storage | 23 | | Builder | Advanced features, testing, deployment | 24 | | Innovator | Performance optimization, native modules, leadership| 25 | 26 | --- 27 | 28 | ## 🛠 Tools Utama 29 | 30 | - **Native**: Swift (iOS), Kotlin/Java (Android) 31 | - **Cross-platform**: React Native, Flutter, Xamarin 32 | - **Hybrid**: Ionic, Cordova 33 | - **Testing**: Jest, Detox, Appium 34 | - **Deployment**: App Store, Google Play, TestFlight 35 | 36 | --- 37 | 38 | ## 📦 Struktur Folder 39 | 40 | ``` 41 | mobile/ 42 | ├── 01-newcomer/ 43 | │ ├── 01/ 44 | │ ├── 02/ 45 | │ ├── 03/ 46 | │ ├── 04/ 47 | │ └── README.md 48 | ├── 02-explorer/ 49 | │ └── README.md 50 | ├── 03-builder/ 51 | │ └── README.md 52 | ├── 04-innovator/ 53 | │ └── README.md 54 | └── README.md 55 | ``` 56 | 57 | --- 58 | 59 | ## 🔗 Referensi Penting 60 | 61 | - [React Native Documentation](https://reactnative.dev/docs/getting-started) 62 | - [Flutter Documentation](https://docs.flutter.dev/) 63 | - [iOS Developer Guide](https://developer.apple.com/develop/) 64 | - [Android Developer Guide](https://developer.android.com/guide) 65 | - [Expo Documentation](https://docs.expo.dev/) 66 | 67 | --- 68 | 69 | > "Mobile development adalah tentang menciptakan pengalaman yang smooth dan intuitive di genggaman user." 70 | -------------------------------------------------------------------------------- /templates/review-templete.md: -------------------------------------------------------------------------------- 1 | # 📝 Review Template – Panduan Memberi Feedback Konstruktif 2 | 3 | Template ini membantu reviewer memberikan penilaian dan masukan yang jelas, adil, dan membangun untuk submission/proyek di PROJECT_LINK. Cocok untuk semua kalangan, baik pemula maupun mentor. 4 | 5 | --- 6 | 7 | ## 1️⃣ **Identitas Submission yang Direview** 8 | 9 | - **Nama Submission/Proyek:** 10 | - **Track/Spesialisasi:** 11 | - **Nama Peserta/Tim:** 12 | - **Tanggal Review:** 13 | - **Reviewer:** 14 | 15 | --- 16 | 17 | ## 2️⃣ **Checklist Review Awal** 18 | 19 | ``` 20 | - [ ] File & folder sesuai format 21 | - [ ] README.md jelas & lengkap 22 | - [ ] Semua file utama tersedia 23 | - [ ] Tidak ada data sensitif/pribadi 24 | - [ ] Submission bisa dijalankan/dibuka 25 | ``` 26 | 27 | --- 28 | 29 | ## 3️⃣ **Penilaian Kriteria Utama** 30 | 31 | | Kriteria | Skor (1-4) | Catatan/Alasan Singkat | 32 | |------------------|------------|---------------------------------------| 33 | | Fungsionalitas | | | 34 | | Kualitas Kode/Desain | | | 35 | | Dokumentasi | | | 36 | | Kreativitas/Inovasi | | | 37 | | Pembelajaran/Refleksi | | | 38 | 39 | **Skor:** 40 | - 4 = Sangat baik/luar biasa 41 | - 3 = Baik/standar 42 | - 2 = Cukup, masih bisa ditingkatkan 43 | - 1 = Perlu perbaikan 44 | 45 | --- 46 | 47 | ## 4️⃣ **Feedback Positif (Apa yang sudah bagus?)** 48 | - ... 49 | 50 | ## 5️⃣ **Saran Perbaikan (Apa yang bisa ditingkatkan?)** 51 | - ... 52 | 53 | ## 6️⃣ **Pertanyaan untuk Peserta (Opsional)** 54 | - ... 55 | 56 | ## 7️⃣ **Rekomendasi** 57 | - [ ] Diterima tanpa revisi 58 | - [ ] Diterima dengan revisi minor 59 | - [ ] Perlu revisi mayor sebelum diterima 60 | 61 | --- 62 | 63 | ## 8️⃣ **Catatan Tambahan (Opsional)** 64 | - ... 65 | 66 | --- 67 | 68 | > **Tips Reviewer:** 69 | > - Gunakan bahasa yang ramah & membangun 70 | > - Fokus pada proses belajar, bukan hanya hasil akhir 71 | > - Sertakan contoh/tautan jika perlu 72 | > - Apresiasi usaha & progres peserta 73 | -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/04/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 04: Testing & Best Practice 🧪 2 | 3 | > **Track**: Development 4 | > **Specialty**: Frontend 5 | > **Level**: 🧱 Builder 6 | > **Estimated Time**: 2 jam 7 | > **Last Updated**: Juli 2025 8 | 9 | --- 10 | 11 | ## 🎯 Tujuan Pembelajaran 12 | 13 | - Menulis unit test untuk komponen React 14 | - Memahami testing library (React Testing Library/Jest) 15 | - Refactor struktur project agar scalable 16 | - Menerapkan best practice frontend (naming, modularisasi, dsb.) 17 | 18 | --- 19 | 20 | ## 📖 Studi Kasus 21 | 22 | > Kamu membangun aplikasi SPA yang mulai kompleks. Untuk menjaga kualitas, kamu perlu menulis test untuk komponen utama dan merapikan struktur project agar mudah dikembangkan tim. 23 | 24 | --- 25 | 26 | ## 🛠 Tools & Setup 27 | 28 | - Lanjutkan dari project sebelumnya 29 | - Install React Testing Library dan Jest 30 | 31 | ```bash 32 | npm install --save-dev @testing-library/react jest 33 | ``` 34 | 35 | --- 36 | 37 | ## 🔧 Tugas Utama 38 | 39 | 1. Buat minimal 3 unit test untuk komponen utama (Header, Main, dsb.) 40 | 2. Refactor struktur folder agar scalable (pisahkan hooks, utils, dsb.) 41 | 3. Terapkan best practice: naming, modularisasi, reusable component 42 | 4. Dokumentasikan struktur project di README 43 | 44 | --- 45 | 46 | ## ✨ Bonus Challenge 47 | 48 | - Tambahkan test untuk custom hook 49 | - Coverage report sederhana 50 | - Integrasi CI (GitHub Actions) 51 | 52 | --- 53 | 54 | ## 📁 Struktur File 55 | 56 | ``` 57 | spa-starter/ 58 | ├── src/ 59 | │ ├── components/ 60 | │ ├── hooks/ 61 | │ ├── utils/ 62 | │ ├── __tests__/ 63 | │ ├── App.js 64 | │ └── ... 65 | ├── README.md 66 | └── fundamental.md 67 | ``` 68 | 69 | --- 70 | 71 | ## ✅ Submission 72 | 73 | ``` 74 | submissions/frontend/[username]/spa-starter/ 75 | ├── src/ 76 | ├── README.md 77 | └── REFLECTION.md 78 | ``` 79 | 80 | --- 81 | 82 | ## 🔗 Referensi 83 | - [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) 84 | - [Jest Docs](https://jestjs.io/) 85 | - [Best Practice React](https://react.dev/learn/thinking-in-react) 86 | 87 | --- 88 | 89 | > "Testing dan struktur rapi = aplikasi frontend yang scalable dan minim bug." -------------------------------------------------------------------------------- /exercises/data/analytics/02-explorer/readme.md: -------------------------------------------------------------------------------- 1 | # 📈 Analytics – Explorer Level 2 | 3 | Selamat datang di level **Explorer** untuk jalur Analytics! Di level ini, kamu akan memperdalam skill analisis data dengan SQL, data cleaning, dan visualisasi yang lebih kompleks. 4 | 5 | --- 6 | 7 | ## 🎯 Tujuan Level 8 | 9 | - Menguasai SQL dasar untuk query dan analisis data 10 | - Belajar teknik data cleaning dan preprocessing 11 | - Membuat visualisasi data yang lebih kompleks dan interaktif 12 | - Melakukan analisis trend dan pattern recognition 13 | - Mengembangkan kemampuan storytelling dengan data 14 | 15 | --- 16 | 17 | ## 📁 Daftar Exercise 18 | 19 | | No. | Judul Latihan | Fokus | 20 | |-----|--------------------------------------|-------------------------------------------| 21 | | 01 | SQL Dasar untuk Analisis Data | SELECT, WHERE, JOIN, aggregation | 22 | | 02 | Data Cleaning & Preprocessing | Missing data, outliers, data validation | 23 | | 03 | Advanced Visualization | Complex charts, interactive dashboards | 24 | | 04 | Mini Project: Customer Segmentation | End-to-end analytics project | 25 | 26 | > Semua latihan disertai `README.md` + `fundamental.md`, dan menggunakan tools yang lebih advanced. 27 | 28 | --- 29 | 30 | ## 🛠 Tools yang Digunakan 31 | 32 | - SQL (SQLite, PostgreSQL) 33 | - Python (pandas, matplotlib, seaborn) 34 | - Tableau/Power BI 35 | - Excel/Google Sheets (advanced) 36 | - Git untuk version control 37 | 38 | --- 39 | 40 | ## ✅ Submission Format 41 | 42 | ``` 43 | submissions/data/analytics/[username]/[exercise-folder]/ 44 | ├── README.md 45 | ├── REFLECTION.md 46 | ├── analysis.sql / .py 47 | ├── dashboard.twbx / .pbix 48 | └── data/ (cleaned datasets) 49 | ``` 50 | 51 | --- 52 | 53 | ## 💬 Catatan untuk Mentor 54 | 55 | - Validasi hasil berdasarkan insight yang dihasilkan, bukan hanya teknik 56 | - Tanyakan interpretasi data dan rekomendasi bisnis 57 | - Dorong penggunaan best practices dalam data cleaning dan visualization 58 | 59 | --- 60 | 61 | > "Level Explorer adalah saatnya berpikir sebagai data analyst: membersihkan data, menganalisis pola, dan menyampaikan insight yang actionable." -------------------------------------------------------------------------------- /resources/tool-and-setup/ml_setup.md: -------------------------------------------------------------------------------- 1 | # 🤖 Machine Learning Setup – Panduan Dasar untuk Semua Kalangan 2 | 3 | Panduan ini membantu kamu memulai eksperimen dan belajar machine learning (ML) dengan tools yang mudah di-setup, baik di laptop sendiri maupun cloud. 4 | 5 | --- 6 | 7 | ## 1️⃣ Tools & Platform Populer 8 | 9 | | Tool/Platform | Fungsi & Kelebihan | 10 | |-----------------|--------------------------------------------| 11 | | Anaconda | Manajemen environment & package Python ML | 12 | | Jupyter Notebook| Eksperimen interaktif, visualisasi | 13 | | Google Colab | ML gratis di cloud, tanpa install lokal | 14 | | VS Code | Bisa untuk coding Python/ML | 15 | | TensorFlow, PyTorch | Library ML populer (install via pip) | 16 | 17 | --- 18 | 19 | ## 2️⃣ Instalasi & Setup Dasar 20 | 21 | ### a. Anaconda (rekomendasi pemula) 22 | - Download: [https://www.anaconda.com/products/distribution](https://www.anaconda.com/products/distribution) 23 | - Install sesuai OS, buka Anaconda Navigator 24 | - Buat environment baru: `conda create -n ml-env python=3.10` 25 | - Aktifkan: `conda activate ml-env` 26 | 27 | ### b. Jupyter Notebook 28 | - Install via Anaconda, atau: 29 | ```bash 30 | pip install notebook 31 | jupyter notebook 32 | ``` 33 | 34 | ### c. Google Colab 35 | - Akses: [https://colab.research.google.com](https://colab.research.google.com) 36 | - Login Google, langsung bisa coding Python ML di browser 37 | 38 | --- 39 | 40 | ## 3️⃣ Tips & Troubleshooting 41 | - **Error install package?** Coba update pip/conda, cek koneksi internet 42 | - **Kernel mati di Jupyter?** Restart kernel, cek RAM cukup 43 | - **Colab disconnect?** Simpan kerjaan, reconnect, atau upgrade ke Pro 44 | 45 | --- 46 | 47 | ## 4️⃣ FAQ 48 | 49 | **Q: Apakah harus install semua tools?** 50 | A: Tidak, pilih salah satu (Colab paling mudah, Anaconda untuk lokal) 51 | 52 | **Q: Bisa ML di HP?** 53 | A: Bisa via Colab di browser HP, tapi lebih nyaman di laptop/PC 54 | 55 | **Q: Library ML gratis?** 56 | A: Ya, TensorFlow, PyTorch, scikit-learn, dsb. open source 57 | 58 | --- 59 | 60 | > "Machine learning makin mudah diakses siapa saja. Mulai dari Colab atau Anaconda, lalu eksplorasi library ML favoritmu!" -------------------------------------------------------------------------------- /exercises/development/frontend/03-builder/01/README.md: -------------------------------------------------------------------------------- 1 | # Exercise 01: SPA Project Starter ⚛️ 2 | 3 | > **Track**: Development 4 | > **Specialty**: Frontend 5 | > **Level**: 🧱 Builder 6 | > **Estimated Time**: 2 jam 7 | > **Last Updated**: Juli 2025 8 | 9 | --- 10 | 11 | ## 🎯 Tujuan Pembelajaran 12 | 13 | - Setup project React (atau framework modern lain) 14 | - Memahami struktur folder aplikasi SPA 15 | - Membuat komponen dasar (Header, Footer, Main) 16 | - Menulis komponen fungsional dan props sederhana 17 | 18 | --- 19 | 20 | ## 📖 Studi Kasus 21 | 22 | > Kamu akan membangun fondasi aplikasi SPA untuk dashboard sederhana. Mulai dari setup project, struktur folder, dan membuat komponen utama yang reusable. 23 | 24 | --- 25 | 26 | ## 🛠 Tools & Setup 27 | 28 | ```bash 29 | # Pilih salah satu: 30 | npx create-react-app spa-starter 31 | # atau 32 | npm create vite@latest spa-starter -- --template react 33 | cd spa-starter 34 | npm install 35 | ``` 36 | 37 | --- 38 | 39 | ## 🔧 Tugas Utama 40 | 41 | 1. Setup project React (CRA/Vite) 42 | 2. Buat struktur folder: `components/`, `pages/`, `assets/` 43 | 3. Buat komponen: 44 | - `Header` (judul aplikasi) 45 | - `Footer` (copyright) 46 | - `Main` (tempat render halaman) 47 | 4. Tampilkan komponen di `App.js` 48 | 5. Gunakan props untuk mengirim data ke komponen 49 | 50 | --- 51 | 52 | ## ✨ Bonus Challenge 53 | 54 | - Tambahkan routing sederhana (React Router) 55 | - Tambahkan styling modular (CSS module/Tailwind) 56 | - Buat halaman About dan Home 57 | 58 | --- 59 | 60 | ## 📁 Struktur File 61 | 62 | ``` 63 | spa-starter/ 64 | ├── src/ 65 | │ ├── components/ 66 | │ ├── pages/ 67 | │ ├── assets/ 68 | │ ├── App.js 69 | │ └── index.js 70 | ├── README.md 71 | └── fundamental.md 72 | ``` 73 | 74 | --- 75 | 76 | ## ✅ Submission 77 | 78 | ``` 79 | submissions/frontend/[username]/spa-starter/ 80 | ├── src/ 81 | ├── README.md 82 | └── REFLECTION.md 83 | ``` 84 | 85 | --- 86 | 87 | ## 🔗 Referensi 88 | - [React Docs](https://react.dev/learn) 89 | - [Vite Guide](https://vitejs.dev/guide/) 90 | - [React Router](https://reactrouter.com/en/main) 91 | 92 | --- 93 | 94 | > "SPA adalah fondasi aplikasi web modern. Mulai dari struktur yang rapi, kamu siap membangun fitur apapun!" --------------------------------------------------------------------------------