🎯 Рекомендуемые коллекции
Балансированные коллекции примеров кода из различных категорий, которые вы можете исследовать
Примеры Markdown
Примеры формата Markdown от простых до сложных структур документов
📝 Базовое форматирование текста
🟢 simple
Базовые примеры форматирования текста Markdown
# Basic Text Formatting
## Headings
# H1 Heading
## H2 Heading
### H3 Heading
#### H4 Heading
##### H5 Heading
###### H6 Heading
## Text Emphasis
*This text is italicized*
_This text is also italicized_
**This text is bold**
__This text is also bold__
***This text is bold and italicized***
___This text is also bold and italicized___
~~This text is strikethrough~~
## Lists
### Unordered Lists
* Item 1
* Item 2
* Nested item 2.1
* Nested item 2.2
* Item 3
### Ordered Lists
1. First item
2. Second item
1. Nested item 2.1
2. Nested item 2.2
3. Third item
## Links
[Inline link](https://www.example.com)
[Link with title](https://www.example.com "Example Website")
<https://www.example.com>
<[email protected]>
## Images
## Code
Inline code: `console.log('Hello, World!')`
```javascript
// Code block
function greet(name) {
return `Hello, ${name}!`;
}
console.log(greet('World'));
```
## Blockquotes
> This is a blockquote.
>
> It can span multiple lines.
>
> > And it can be nested.
## Horizontal Rule
---
***
## Tables
| Header 1 | Header 2 | Header 3 |
|----------|----------|----------|
| Cell 1 | Cell 2 | Cell 3 |
| Cell 4 | Cell 5 | Cell 6 |
| Left align | Center align | Right align |
| :--- | :---: | ---: |
| Content 1 | Content 2 | Content 3 |
| Content 4 | Content 5 | Content 6 |📝 Документ README
🟡 intermediate
Пример документа README проекта
# My Awesome Project
[](https://github.com/user/repo/actions)
[](LICENSE)
[](https://github.com/user/repo/releases)
A brief description of what this project does and who it's for.
## Features
- ✨ Feature 1: Description of awesome feature
- 🚀 Feature 2: Another amazing capability
- 🔧 Feature 3: Powerful functionality
- 📱 Feature 4: Mobile-friendly design
- 🔒 Feature 5: Secure implementation
## Installation
### Prerequisites
- Node.js (v14 or higher)
- npm or yarn
- Git
### Setup
1. Clone the repository:
```bash
git clone https://github.com/username/my-awesome-project.git
cd my-awesome-project
```
2. Install dependencies:
```bash
npm install
# or
yarn install
```
3. Configure environment variables:
```bash
cp .env.example .env
# Edit .env with your configuration
```
4. Run the application:
```bash
npm start
# or
yarn start
```
## Usage
Basic usage example:
```javascript
const myApp = require('my-awesome-project');
// Initialize the application
const app = new myApp({
apiKey: 'your-api-key',
environment: 'development'
});
// Use the application
app.doSomething();
```
## Configuration
The application can be configured using environment variables:
| Variable | Description | Default |
|----------|-------------|---------|
| `API_KEY` | Your API key | `null` |
| `PORT` | Server port | `3000` |
| `ENV` | Environment | `development` |
| `LOG_LEVEL` | Logging level | `info` |
## API Reference
### Methods
#### `app.init(options)`
Initialize the application with options.
**Parameters:**
- `options` (Object): Configuration options
- `apiKey` (string): Your API key
- `environment` (string): Environment name
**Returns:** Promise<void`
#### `app.getData(id)`
Retrieve data by ID.
**Parameters:**
- `id` (string): Data identifier
**Returns:** Promise<Object`
## Contributing
We welcome contributions! Please follow these steps:
1. Fork the repository
2. Create a feature branch: `git checkout -b feature/amazing-feature`
3. Commit your changes: `git commit -m 'Add amazing feature'`
4. Push to the branch: `git push origin feature/amazing-feature`
5. Open a Pull Request
### Development
To set up the development environment:
```bash
# Install development dependencies
npm install --dev
# Run tests
npm test
# Run linting
npm run lint
# Start development server
npm run dev
```
## Testing
Run the test suite:
```bash
npm test
# Run with coverage
npm run test:coverage
# Run integration tests
npm run test:integration
```
## License
This project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.
## Support
- 📧 Email: [email protected]
- 🐛 Issues: [GitHub Issues](https://github.com/user/repo/issues)
- 📖 Documentation: [Docs Site](https://docs.example.com)
- 💬 Discord: [Community Server](https://discord.gg/example)
## Acknowledgments
- Thanks to [Awesome Library](https://github.com/example/library) for the core functionality
- Inspired by [Cool Project](https://github.com/example/cool-project)
- Built with ❤️ by the community📝 Пост в блоге
🟡 intermediate
Полная структура поста в блоге на Markdown
---
title: "Getting Started with Modern Web Development"
date: "2024-01-15"
author: "Jane Smith"
category: "Web Development"
tags: ["JavaScript", "React", "Web Development"]
description: "A comprehensive guide to starting your journey in modern web development"
image: "/images/web-dev-hero.jpg"
---
# Getting Started with Modern Web Development
> "The best way to learn is by doing. Let's build something amazing together!"
Web development has evolved dramatically over the past decade. Whether you're a complete beginner or an experienced developer looking to update your skills, this guide will help you navigate the modern web development landscape.
## Table of Contents
- [Frontend Technologies](#frontend-technologies)
- [Backend Technologies](#backend-technologies)
- [Development Tools](#development-tools)
- [Best Practices](#best-practices)
- [Conclusion](#conclusion)
## Frontend Technologies
### HTML5 & CSS3
The foundation of web development starts with HTML and CSS:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Modern Web App</title>
</head>
<body>
<header>
<h1>Welcome to Modern Web Development</h1>
</header>
<main>
<p>This is a semantic HTML structure.</p>
</main>
</body>
</html>
```
### JavaScript ES6+
Modern JavaScript provides powerful features:
```javascript
// ES6+ features
const apiUrl = 'https://api.example.com/data';
// Async/await for API calls
async function fetchData() {
try {
const response = await fetch(apiUrl);
const data = await response.json();
return data;
} catch (error) {
console.error('Error fetching data:', error);
}
}
// Arrow functions and destructuring
const processData = ({ items = [], filters = {} }) => {
return items.filter(item => {
return Object.entries(filters).every(([key, value]) =>
item[key] === value
);
});
};
```
### React Framework
React continues to dominate the frontend landscape:
```jsx
import React, { useState, useEffect } from 'react';
const UserProfile = ({ userId }) => {
const [user, setUser] = useState(null);
const [loading, setLoading] = useState(true);
useEffect(() => {
fetchUserData(userId)
.then(setUser)
.finally(() => setLoading(false));
}, [userId]);
if (loading) return <div>Loading...</div>;
return (
<div className="user-profile">
<img src={user.avatar} alt={user.name} />
<h2>{user.name}</h2>
<p>{user.email}</p>
</div>
);
};
```
## Backend Technologies
### Node.js & Express
Node.js has become the go-to choice for JavaScript backend development:
```javascript
const express = require('express');
const cors = require('cors');
const helmet = require('helmet');
const app = express();
// Middleware
app.use(helmet());
app.use(cors());
app.use(express.json());
// Routes
app.get('/api/users', async (req, res) => {
try {
const users = await User.find();
res.json({
success: true,
data: users
});
} catch (error) {
res.status(500).json({
success: false,
error: error.message
});
}
});
// Start server
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(`Server running on port ${PORT}`);
});
```
### Database Integration
Modern applications need robust data storage:
```javascript
// MongoDB with Mongoose
const mongoose = require('mongoose');
const userSchema = new mongoose.Schema({
name: {
type: String,
required: true,
trim: true
},
email: {
type: String,
required: true,
unique: true,
lowercase: true
},
createdAt: {
type: Date,
default: Date.now
}
});
const User = mongoose.model('User', userSchema);
// Example usage
const createUser = async (userData) => {
try {
const user = new User(userData);
await user.save();
return user;
} catch (error) {
throw new Error(`Failed to create user: ${error.message}`);
}
};
```
## Development Tools
### Package Management
Modern development relies heavily on package managers:
```bash
# Initialize a new project
npm init -y
# Install production dependencies
npm install react express mongodb
# Install development dependencies
npm install --save-dev eslint prettier jest
# Run scripts
npm run dev
npm test
npm build
```
### Version Control with Git
```bash
# Essential Git commands
git init # Initialize repository
git add . # Stage all changes
git commit -m "Initial commit" # Commit changes
git push origin main # Push to remote
git checkout -b feature-branch # Create new branch
git merge feature-branch # Merge branches
```
## Best Practices
### 1. Code Organization
```
src/
├── components/ # React components
├── utils/ # Utility functions
├── services/ # API services
├── hooks/ # Custom hooks
├── styles/ # CSS/styling
├── tests/ # Test files
└── index.js # Entry point
```
### 2. Performance Optimization
```javascript
// Use React.memo for component optimization
const ExpensiveComponent = React.memo(({ data }) => {
// Component logic
});
// Implement lazy loading
const LazyComponent = React.lazy(() => import('./LazyComponent'));
// Use useMemo for expensive calculations
const processedData = useMemo(() => {
return rawData.filter(item => item.active).map(processItem);
}, [rawData]);
```
### 3. Security Best Practices
```javascript
// Input validation
const validateInput = (input) => {
if (!input || typeof input !== 'string') {
throw new Error('Invalid input');
}
return input.trim();
};
// Secure API keys
const config = {
apiKey: process.env.API_KEY, // Never hardcode API keys
dbPassword: process.env.DB_PASSWORD
};
```
## Conclusion
Modern web development offers incredible tools and frameworks that make building applications more efficient and enjoyable. The key is to:
1. **Start with the fundamentals** - Master HTML, CSS, and JavaScript
2. **Choose the right tools** - Select frameworks that fit your project needs
3. **Follow best practices** - Write clean, maintainable code
4. **Keep learning** - The web development landscape is constantly evolving
Remember, the journey of becoming a proficient web developer is a marathon, not a sprint. Take it one step at a time, build projects, and don't be afraid to experiment with new technologies.
---
### Additional Resources
- [MDN Web Docs](https://developer.mozilla.org/) - Comprehensive web development documentation
- [FreeCodeCamp](https://www.freecodecamp.org/) - Free coding courses and projects
- [Dev.to](https://dev.to/) - Developer community and articles
- [Stack Overflow](https://stackoverflow.com/) - Q&A for programming questions
### Join the Conversation
Have questions or want to share your web development journey? Leave a comment below or connect with me on [Twitter](https://twitter.com/yourhandle)!
*Happy coding! 🚀*📝 Техническая документация
🔴 complex
Примеры документации API и технических спецификаций
# API Documentation
## Overview
The User Management API provides comprehensive endpoints for managing user accounts, authentication, and profile management in modern web applications.
**Base URL:** \`https://api.example.com/v1\`
**Authentication:** Bearer Token (JWT)
## Table of Contents
- [Authentication](#authentication)
- [Endpoints](#endpoints)
- [Error Handling](#error-handling)
- [Rate Limiting](#rate-limiting)
- [Data Models](#data-models)
- [SDK Examples](#sdk-examples)
## Authentication
### Obtaining API Keys
To use this API, you'll need an API key. Contact our [developer support](mailto:[email protected]) to get access.
### JWT Authentication
All API requests must include a valid JWT token in the Authorization header:
```http
Authorization: Bearer <your-jwt-token>
```
### Token Refresh
Access tokens expire after 24 hours. Use the refresh endpoint to generate new tokens:
```http
POST /auth/refresh
Content-Type: application/json
{
"refresh_token": "your-refresh-token"
}
```
## Endpoints
### Users
#### Create User
Create a new user account.
```http
POST /users
Content-Type: application/json
Authorization: Bearer <token>
{
"email": "[email protected]",
"password": "securePassword123!",
"first_name": "John",
"last_name": "Doe",
"profile": {
"date_of_birth": "1990-01-15",
"phone_number": "+1-555-0123"
}
}
```
**Response:**
```json
{
"success": true,
"data": {
"id": "usr_123456789",
"email": "[email protected]",
"first_name": "John",
"last_name": "Doe",
"status": "active",
"created_at": "2024-01-15T10:30:00Z",
"updated_at": "2024-01-15T10:30:00Z"
}
}
```
#### Get User
Retrieve user details by ID.
```http
GET /users/{user_id}
Authorization: Bearer <token>
```
**Path Parameters:**
- `user_id` (string, required): Unique identifier for the user
**Query Parameters:**
- `include` (string, optional): Comma-separated list of related data to include
- Options: `profile`, `preferences`, `permissions`
**Example:**
```http
GET /users/usr_123456789?include=profile,preferences
```
#### Update User
Update user information.
```http
PUT /users/{user_id}
Content-Type: application/json
Authorization: Bearer <token>
{
"first_name": "Jane",
"profile": {
"phone_number": "+1-555-0124"
}
}
```
#### List Users
Retrieve a paginated list of users.
```http
GET /users?page=1&limit=20&status=active&sort=created_at:desc
Authorization: Bearer <token>
```
**Query Parameters:**
- `page` (integer, optional): Page number (default: 1)
- `limit` (integer, optional): Items per page (default: 20, max: 100)
- `status` (string, optional): Filter by status
- Options: `active`, `inactive`, `suspended`
- `sort` (string, optional): Sort field and direction
- Format: `field:direction`
- Options: `created_at`, `updated_at`, `email`, `first_name`
- Directions: `asc`, `desc`
### Authentication
#### Login
Authenticate user and receive access tokens.
```http
POST /auth/login
Content-Type: application/json
{
"email": "[email protected]",
"password": "userPassword123!",
"remember_me": false
}
```
**Response:**
```json
{
"success": true,
"data": {
"access_token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...",
"refresh_token": "def50200...7a5b",
"token_type": "Bearer",
"expires_in": 86400,
"user": {
"id": "usr_123456789",
"email": "[email protected]",
"first_name": "John",
"last_name": "Doe"
}
}
}
```
#### Logout
Invalidate the current access token.
```http
POST /auth/logout
Authorization: Bearer <token>
```
#### Change Password
Change user password.
```http
POST /auth/change-password
Content-Type: application/json
Authorization: Bearer <token>
{
"current_password": "oldPassword123!",
"new_password": "newPassword456!"
}
```
## Error Handling
### HTTP Status Codes
| Status Code | Meaning | Description |
|-------------|---------|-------------|
| 200 | OK | Request successful |
| 201 | Created | Resource created successfully |
| 400 | Bad Request | Invalid request data |
| 401 | Unauthorized | Authentication required |
| 403 | Forbidden | Insufficient permissions |
| 404 | Not Found | Resource not found |
| 409 | Conflict | Resource conflict |
| 429 | Too Many Requests | Rate limit exceeded |
| 500 | Internal Server Error | Server error |
### Error Response Format
All error responses follow this format:
```json
{
"success": false,
"error": {
"code": "VALIDATION_ERROR",
"message": "Invalid request data",
"details": [
{
"field": "email",
"message": "Email is required and must be valid"
},
{
"field": "password",
"message": "Password must be at least 8 characters"
}
]
},
"request_id": "req_123456789"
}
```
### Common Error Codes
- `VALIDATION_ERROR`: Request data validation failed
- `AUTHENTICATION_FAILED`: Invalid credentials
- `AUTHORIZATION_REQUIRED`: Authentication required
- `RESOURCE_NOT_FOUND`: Requested resource not found
- `RATE_LIMIT_EXCEEDED`: API rate limit exceeded
- `INTERNAL_SERVER_ERROR`: Unexpected server error
## Rate Limiting
### Rate Limits
- **Standard Tier:** 1,000 requests per hour
- **Premium Tier:** 10,000 requests per hour
- **Enterprise Tier:** Unlimited requests
### Rate Limit Headers
API responses include rate limiting headers:
```http
X-RateLimit-Limit: 1000
X-RateLimit-Remaining: 999
X-RateLimit-Reset: 1642291200
```
### Handling Rate Limits
When rate limited, the API returns a `429 Too Many Requests` response:
```json
{
"success": false,
"error": {
"code": "RATE_LIMIT_EXCEEDED",
"message": "API rate limit exceeded. Try again later.",
"retry_after": 3600
}
}
```
## Data Models
### User Object
```json
{
"id": "usr_123456789",
"email": "[email protected]",
"first_name": "John",
"last_name": "Doe",
"status": "active",
"profile": {
"date_of_birth": "1990-01-15",
"phone_number": "+1-555-0123",
"address": {
"street": "123 Main St",
"city": "New York",
"state": "NY",
"postal_code": "10001",
"country": "US"
}
},
"preferences": {
"language": "en",
"timezone": "America/New_York",
"notifications": {
"email": true,
"sms": false,
"push": true
}
},
"created_at": "2024-01-15T10:30:00Z",
"updated_at": "2024-01-15T10:30:00Z",
"last_login_at": "2024-01-20T09:15:00Z"
}
```
## SDK Examples
### JavaScript/Node.js
```javascript
const { UserAPI } = require('@example/api-sdk');
const client = new UserAPI({
apiKey: process.env.API_KEY,
baseURL: 'https://api.example.com/v1'
});
// Create a user
async function createUser(userData) {
try {
const user = await client.users.create(userData);
console.log('User created:', user);
return user;
} catch (error) {
console.error('Error creating user:', error.message);
}
}
// Get user with includes
async function getUserWithProfile(userId) {
try {
const user = await client.users.get(userId, {
include: ['profile', 'preferences']
});
return user;
} catch (error) {
if (error.code === 'RESOURCE_NOT_FOUND') {
console.log('User not found');
}
throw error;
}
}
```
### Python
```python
from example_api import UserAPI
from example_api.exceptions import APIError
client = UserAPI(
api_key=os.environ.get('API_KEY'),
base_url='https://api.example.com/v1'
)
# Create a user
try:
user = client.users.create({
'email': '[email protected]',
'first_name': 'John',
'last_name': 'Doe',
'password': 'securePassword123!'
})
print(f"User created: {user.id}")
except APIError as e:
print(f"API Error: {e.message}")
# List users with filters
users = client.users.list(
status='active',
sort='created_at:desc',
limit=50
)
```
### cURL
```bash
# Create a user
curl -X POST https://api.example.com/v1/users \
-H "Content-Type: application/json" \
-H "Authorization: Bearer YOUR_TOKEN" \
-d '{
"email": "[email protected]",
"first_name": "John",
"last_name": "Doe",
"password": "securePassword123!"
}'
# Get user with includes
curl -X GET "https://api.example.com/v1/users/usr_123456789?include=profile,preferences" \
-H "Authorization: Bearer YOUR_TOKEN"
```
## Support
- **Documentation:** [https://docs.example.com](https://docs.example.com)
- **API Status:** [https://status.example.com](https://status.example.com)
- **Support Email:** [[email protected]](mailto:[email protected])
- **Developer Community:** [https://community.example.com](https://community.example.com)
## Changelog
### v2.1.0 (2024-01-15)
- Added bulk user creation endpoint
- Improved error messages for validation failures
- Fixed issue with timezone handling
### v2.0.0 (2023-12-01)
- Major API redesign
- Added JWT authentication
- Removed deprecated endpoints
---
*Last updated: January 15, 2024*