https://github.com/telkomdev/curriculum-fe-nextjs
https://github.com/telkomdev/curriculum-fe-nextjs
Last synced: 4 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/telkomdev/curriculum-fe-nextjs
- Owner: telkomdev
- License: mit
- Created: 2025-01-17T04:33:22.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-01-17T04:38:13.000Z (11 months ago)
- Last Synced: 2025-01-24T21:15:50.593Z (11 months ago)
- Language: JavaScript
- Size: 5.38 MB
- Stars: 0
- Watchers: 5
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Curriculum FE Next.js
Welcome to the **Curriculum FE Next.js** repository! This curriculum is designed to onboard new employees efficiently and help them ramp up on the tools, technologies, and workflows used in our organization. The focus is on building a solid understanding of **Next.js** and the front-end development practices we follow.
---
## Table of Contents
1. [Overview](#overview)
2. [Getting Started](#getting-started)
3. [Repository Structure](#repository-structure)
4. [Onboarding Curriculum](#onboarding-curriculum)
5. [Learning Objectives](#learning-objectives)
6. [Contributing](#contributing)
7. [Support](#support)
---
## Overview
This repository serves as the primary resource for onboarding new front-end engineers. It contains:
- Interactive learning modules.
- Project-based tasks to reinforce learning.
- Best practices for working with **Next.js** and our tech stack.
- Hands-on exercises to familiarize new hires with the workflows and coding standards.
By completing this curriculum, new employees will:
- Gain confidence in working with **Next.js**.
- Understand our front-end development processes.
- Be equipped to contribute to production code.
---
## Getting Started
1. **Clone the Repository**
```bash
git clone https://github.com/telkomdev/curriculum-fe-nextjs.git
cd curriculum-fe-nextjs
```
2. **Install Dependencies**
Ensure you have Node.js and npm installed. Then, run:
```bash
npm install
```
3. **Run the Curriculum**
Launch the curriculum locally:
```bash
npm run dev
```
Access the curriculum at `http://localhost:3000`.
---
## Repository Structure
```
curriculum-fe-nextjs/
├── public/ # Static assets (images, etc.)
├── src/
│ ├── components/ # Reusable UI components
│ ├── modules/ # Curriculum-specific modules
│ ├── pages/ # Next.js pages
│ ├── styles/ # Global and module-specific styles
│ ├── utils/ # Utility functions
├── .env.example # Example environment variables
├── README.md # Project documentation
├── package.json # Project metadata and dependencies
└── next.config.js # Next.js configuration
```
---
## Onboarding Curriculum
The curriculum is divided into the following modules:
1. **Introduction to Next.js**
- What is Next.js?
- Key features and benefits.
2. **Project Setup and Configuration**
- Setting up a Next.js project.
- Understanding project structure and configurations.
3. **Routing and Navigation**
- Pages and dynamic routing.
- API routes in Next.js.
4. **State Management**
- Local state with React.
- Global state management strategies.
5. **Styling**
- CSS Modules.
- TailwindCSS (if applicable).
- Best practices for styling components.
6. **Data Fetching**
- `getStaticProps`, `getServerSideProps`, and `getStaticPaths`.
- Client-side data fetching.
7. **Performance Optimization**
- Image optimization.
- Code splitting and lazy loading.
8. **Deployment**
- Deploying a Next.js application to production.
Each module includes:
- Reading materials.
- Coding exercises.
- A mini-project to practice concepts.
---
## Learning Objectives
By the end of the curriculum, participants will:
- Understand the core principles of Next.js.
- Be able to build scalable, performant front-end applications.
- Write clean, maintainable, and reusable code.
- Follow best practices in front-end development and our team’s standards.
---
## Contributing
Contributions to this repository are welcome! If you have suggestions for improving the curriculum:
1. Fork the repository.
2. Create a new branch.
3. Make your changes.
4. Submit a pull request with a clear description of your updates.
---
## Support
If you encounter any issues or have questions:
- Check the [Issues](https://github.com/telkomdev/curriculum-fe-nextjs/issues) section for existing discussions.
- Reach out to the onboarding team via Slack or email.
Happy learning! 🎉