├── .changeset ├── README.md └── config.json ├── .gitignore ├── .npmrc ├── README.md ├── apps ├── docs │ ├── .eslintrc.js │ ├── .storybook │ │ ├── main.js │ │ └── preview.js │ ├── package.json │ ├── postcss.config.js │ ├── stories │ │ ├── Alert │ │ │ └── Alert.stories.tsx │ │ ├── Button │ │ │ └── Button.stories.tsx │ │ ├── Colors │ │ │ └── Colors.stories.mdx │ │ ├── IconButton │ │ │ └── IconButton.stories.tsx │ │ ├── Input │ │ │ └── Input.stories.tsx │ │ ├── Spinner │ │ │ └── Spinner.stories.tsx │ │ └── TextArea │ │ │ └── TextArea.stories.tsx │ ├── styles │ │ └── tailwind.css │ └── tailwind.config.js └── web │ ├── .eslintrc.js │ ├── .gitignore │ ├── .vscode │ └── settings.json │ ├── next.config.js │ ├── package-lock.json │ ├── package.json │ ├── postcss.config.js │ ├── public │ ├── favicon.ico │ ├── next.svg │ ├── thirteen.svg │ └── vercel.svg │ ├── src │ ├── app │ │ ├── head.tsx │ │ └── layout.tsx │ ├── assets │ │ ├── images │ │ │ └── logo.png │ │ └── lotties │ │ │ ├── 404.json │ │ │ ├── mailVerification.json │ │ │ └── new-topic.json │ ├── components │ │ └── Layout │ │ │ ├── AuthLayout.tsx │ │ │ ├── Header │ │ │ ├── Menu │ │ │ │ ├── Dropdown.tsx │ │ │ │ └── index.tsx │ │ │ ├── SearchBox.tsx │ │ │ └── index.tsx │ │ │ └── MainLayout.tsx │ ├── pages │ │ ├── _app.tsx │ │ ├── auth │ │ │ └── login.tsx │ │ └── index.tsx │ ├── store │ │ ├── auth │ │ │ ├── authSlice.ts │ │ │ └── authThunk.ts │ │ ├── index.ts │ │ └── topic │ │ │ ├── topicSlice.ts │ │ │ └── topicThunk.ts │ ├── style.css │ ├── types │ │ ├── index.ts │ │ └── page.d.ts │ └── utils │ │ ├── errors.ts │ │ ├── hooks.ts │ │ └── schemas.ts │ ├── tailwind.config.js │ └── tsconfig.json ├── package.json ├── packages ├── config │ ├── package.json │ └── tailwind.config.js ├── eslint-config-devsozluk │ ├── index.js │ └── package.json ├── tsconfig │ ├── base.json │ ├── node16.json │ ├── package.json │ └── react-library.json └── ui │ ├── .eslintrc.js │ ├── package.json │ ├── src │ ├── Alert │ │ ├── Alert.icons.tsx │ │ └── Alert.tsx │ ├── Button │ │ └── Button.tsx │ ├── IconButton │ │ └── IconButton.tsx │ ├── Input │ │ └── Input.tsx │ ├── Spinner │ │ └── Spinner.tsx │ ├── TextArea │ │ └── TextArea.tsx │ └── index.tsx │ └── tsconfig.json ├── pnpm-lock.yaml ├── pnpm-workspace.yaml ├── prettierrc.json └── turbo.json /.changeset/README.md: -------------------------------------------------------------------------------- 1 | # Changesets 2 | 3 | Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works 4 | with multi-package repos, or single-package repos to help you version and publish your code. You can 5 | find the full documentation for it [in our repository](https://github.com/changesets/changesets) 6 | 7 | We have a quick list of common questions to get you started engaging with this project in 8 | [our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md) 9 | -------------------------------------------------------------------------------- /.changeset/config.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://unpkg.com/@changesets/config@2.0.0/schema.json", 3 | "changelog": "@changesets/cli/changelog", 4 | "commit": false, 5 | "fixed": [], 6 | "linked": [], 7 | "access": "public", 8 | "updateInternalDependencies": "patch", 9 | "ignore": ["@devsozluk/docs"] 10 | } 11 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | .turbo 4 | *.log 5 | .next 6 | dist 7 | dist-ssr 8 | *.local 9 | .env 10 | .cache 11 | server/dist 12 | public/dist 13 | storybook-static/ 14 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | auto-install-peers = true 2 | node-linker=hoisted 3 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |
2 | 3 | DevSozluk Logo 8 | 9 |
10 |
11 | 12 | [![Website](https://img.shields.io/website?url=https://www.devsozluk.net)](https://www.devsozluk.net/) 13 | ![GitHub stars](https://img.shields.io/github/stars/devsozluk/website?logo=github) 14 | ![GitHub forks](https://img.shields.io/github/forks/devsozluk/website?logo=github) 15 | [![GitHub commits](https://badgen.net/github/commits/Naereen/Strapdown.js)](https://GitHub.com/devsozluk/commit) 16 | ![GitHub contributors](https://img.shields.io/github/contributors/devsozluk/website?logo=github) 17 |
18 |
19 | 20 | ## **About** 21 | 22 | **DevSözlük**, The project I have created is a platform that aims to facilitate communication, knowledge sharing, and question and answer opportunities among software developers. In this project, I have built a structure that allows other software developers to contribute as well. This platform enables software developers to share their ideas, answer questions, and help each other. 23 | 24 | ## **Folder Structure** 25 | 26 | ```sh 27 | ├── devsozluk/ 28 | └── src/ # Source files 29 | ├── assets/ # Static files 30 | ├── components/ # React components 31 | │ ├── Elements/ # Basic components 32 | │ ├── Form/ # Form components 33 | │ ├── Layout/ # Layout components 34 | │ └── Loading/ # Loading components 35 | ├── libs/ # Libraries 36 | ├── pages/ # Pages 37 | │ ├── auth/ # Authentication pages 38 | │ │ ├── Login # Login page 39 | │ │ ├── Register # Register page 40 | │ │ ├── Redirect # Redirect page 41 | │ │ └── EmailVerification # Email verification page 42 | │ ├── errors/ # Error pages 43 | │ │ └── NotFound # Not found page 44 | │ ├── Home # Home page 45 | │ ├── Profile # Profile page 46 | │ └── Topic # Topic page 47 | ├── router/ # React router 48 | ├── store/ # Redux store 49 | ├── types/ # Typescript types 50 | └── utils/ # Utilities 51 | ``` 52 | 53 | ## **Tech Stack** 54 | 55 | - [`Vite`](https://vitejs.dev/) 56 | - [`React`](https://reactjs.org/) 57 | - [`React-Router`](https://reactrouter.com/en/main) 58 | - [`React-Redux`](https://react-redux.js.org/) 59 | - [`TypeScript`](https://www.typescriptlang.org/) 60 | - [`TailwindCSS`](https://tailwindcss.com/) 61 | - [`Altogic`](https://www.altogic.com/) 62 | 63 | 64 | ## **Tasks** 65 | 66 | - [x] Added role-based authentication. 67 | - [x] Mail Verification system will be added. 68 | - [ ] User profile pages will be added. 69 | - [ ] Badge system will be added for users. -------------------------------------------------------------------------------- /apps/docs/.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | extends: ["devsozluk"], 4 | }; 5 | -------------------------------------------------------------------------------- /apps/docs/.storybook/main.js: -------------------------------------------------------------------------------- 1 | const path = require("path"); 2 | 3 | module.exports = { 4 | stories: ["../stories/**/*.stories.mdx", "../stories/**/*.stories.tsx"], 5 | addons: ["@storybook/addon-links", "@storybook/addon-essentials", "storybook-dark-mode", 6 | { 7 | name: '@storybook/addon-postcss', 8 | options: { 9 | cssLoaderOptions: { 10 | importLoaders: 1, 11 | }, 12 | postcssLoaderOptions: { 13 | implementation: require('postcss'), 14 | }, 15 | }, 16 | }], 17 | framework: "@storybook/react", 18 | core: { 19 | builder: "@storybook/builder-vite", 20 | }, 21 | async viteFinal(config, { configType }) { 22 | // customize the Vite config here 23 | return { 24 | ...config, 25 | resolve: { 26 | alias: [ 27 | { 28 | find: "@devsozluk/ui", 29 | replacement: path.resolve( 30 | __dirname, 31 | "../../../packages/ui" 32 | ), 33 | }, 34 | ], 35 | }, 36 | }; 37 | }, 38 | }; 39 | -------------------------------------------------------------------------------- /apps/docs/.storybook/preview.js: -------------------------------------------------------------------------------- 1 | import '../styles/tailwind.css'; 2 | -------------------------------------------------------------------------------- /apps/docs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@devsozluk/docs", 3 | "version": "0.0.0", 4 | "private": true, 5 | "scripts": { 6 | "dev": "start-storybook -p 6006", 7 | "build": "build-storybook", 8 | "preview-storybook": "serve storybook-static", 9 | "clean": "rm -rf .turbo && rm -rf node_modules" 10 | }, 11 | "dependencies": { 12 | "@devsozluk/ui": "workspace:0.0.0", 13 | "@uiw/react-md-editor": "^3.20.2", 14 | "react": "^18.2.0", 15 | "react-dom": "^18.2.0", 16 | "react-icons": "^4.7.1" 17 | }, 18 | "devDependencies": { 19 | "@devsozluk/config": "workspace:0.0.0", 20 | "@devsozluk/tsconfig": "workspace:0.0.0", 21 | "@storybook/addon-actions": "^6.5.14", 22 | "@storybook/addon-docs": "^6.5.14", 23 | "@storybook/addon-essentials": "^6.5.14", 24 | "@storybook/addon-links": "^6.5.14", 25 | "@storybook/addon-postcss": "^2.0.0", 26 | "@storybook/builder-vite": "^0.1.41", 27 | "@storybook/react": "^6.5.14", 28 | "@vitejs/plugin-react": "^1.3.2", 29 | "serve": "^13.0.4", 30 | "storybook-dark-mode": "^2.0.5", 31 | "tailwindcss": "^3.2.4", 32 | "typescript": "^4.9.3", 33 | "vite": "^2.9.15" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /apps/docs/postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | } 6 | } -------------------------------------------------------------------------------- /apps/docs/stories/Alert/Alert.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import { ComponentMeta } from "@storybook/react"; 4 | 5 | import { Alert, type AlertProps } from "@devsozluk/ui/src"; 6 | 7 | export default { 8 | title: "components/Alert", 9 | component: Alert, 10 | argTypes: { 11 | children: { 12 | control: { 13 | type: "text", 14 | }, 15 | }, 16 | variant: { 17 | control: { 18 | type: "select", 19 | options: ["success", "danger", "warning"], 20 | }, 21 | }, 22 | }, 23 | } as ComponentMeta; 24 | 25 | const Template = (args: AlertProps) => {args.children}; 26 | 27 | export const Success = Template.bind({}); 28 | 29 | Success.args = { 30 | variant: "success", 31 | children: "Başarıyla giriş yaptın.", 32 | }; 33 | 34 | export const Warning = Template.bind({}); 35 | 36 | Warning.args = { 37 | variant: "warning", 38 | children: "Girdiğiniz bilgileri kontrol edin.", 39 | }; 40 | 41 | export const Danger = Template.bind({}); 42 | 43 | Danger.args = { 44 | variant: "danger", 45 | children: "Girdiğiniz bilgileri kontrol edin.", 46 | }; 47 | -------------------------------------------------------------------------------- /apps/docs/stories/Button/Button.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import { ComponentMeta } from "@storybook/react"; 4 | 5 | import { Button, ButtonProps } from "@devsozluk/ui/src"; 6 | 7 | import { FiFilePlus } from "react-icons/fi"; 8 | 9 | export default { 10 | title: "components/Button", 11 | component: Button, 12 | argTypes: { 13 | disabled: { 14 | control: { 15 | type: "boolean", 16 | }, 17 | }, 18 | loading: { 19 | control: { 20 | type: "boolean", 21 | }, 22 | }, 23 | variant: { 24 | control: { 25 | type: "select", 26 | options: ["primary", "danger", "link"], 27 | }, 28 | }, 29 | size: { 30 | control: { 31 | type: "select", 32 | options: ["sm", "md", "lg"], 33 | }, 34 | }, 35 | }, 36 | } as ComponentMeta; 37 | 38 | const Template = (args: ButtonProps) => ( 39 | 40 | ); 41 | 42 | export const Primary = Template.bind({}); 43 | 44 | Primary.args = { 45 | variant: "primary", 46 | }; 47 | 48 | export const Outline = Template.bind({}); 49 | 50 | Outline.args = { 51 | variant: "outline", 52 | }; 53 | 54 | export const Danger = Template.bind({}); 55 | 56 | Danger.args = { 57 | variant: "danger", 58 | }; 59 | 60 | export const Disabled = Template.bind({}); 61 | 62 | Disabled.args = { 63 | disabled: true, 64 | }; 65 | 66 | export const Loading = Template.bind({}); 67 | 68 | Loading.args = { 69 | loading: true, 70 | }; 71 | -------------------------------------------------------------------------------- /apps/docs/stories/Colors/Colors.stories.mdx: -------------------------------------------------------------------------------- 1 | import { Meta, ColorPalette, ColorItem } from '@storybook/addon-docs'; 2 | 3 | 4 | 5 | 6 | 10 | 15 | 20 | -------------------------------------------------------------------------------- /apps/docs/stories/IconButton/IconButton.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import { ComponentMeta } from "@storybook/react"; 4 | 5 | import { IconButton, IconButtonProps } from "@devsozluk/ui/src"; 6 | 7 | import { FiFilePlus } from "react-icons/fi"; 8 | 9 | export default { 10 | title: "components/IconButton", 11 | component: IconButton, 12 | argTypes: { 13 | disabled: { 14 | control: { 15 | type: "boolean", 16 | }, 17 | }, 18 | loading: { 19 | control: { 20 | type: "boolean", 21 | }, 22 | }, 23 | }, 24 | } as ComponentMeta; 25 | 26 | const Template = (args: IconButtonProps) => ( 27 | 28 | 29 | 30 | ); 31 | 32 | export const Default = Template.bind({}); 33 | 34 | export const Disabled = Template.bind({}); 35 | 36 | Disabled.args = { 37 | disabled: true, 38 | }; 39 | 40 | export const Loading = Template.bind({}); 41 | 42 | Loading.args = { 43 | loading: true, 44 | }; 45 | -------------------------------------------------------------------------------- /apps/docs/stories/Input/Input.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import { ComponentMeta } from "@storybook/react"; 4 | 5 | import { Input, InputProps } from "@devsozluk/ui/src"; 6 | import { RiMailFill } from "react-icons/ri"; 7 | 8 | export default { 9 | title: "components/Input", 10 | component: Input, 11 | argTypes: { 12 | label: { 13 | control: { 14 | type: "text", 15 | }, 16 | }, 17 | placeholder: { 18 | control: { 19 | type: "text", 20 | }, 21 | }, 22 | errorMessage: { 23 | control: { 24 | type: "text", 25 | }, 26 | }, 27 | }, 28 | } as ComponentMeta; 29 | 30 | export const TextInput = (args: InputProps) => ( 31 | 32 | ); 33 | 34 | export const InputWithIcon = (args: InputProps) => ( 35 | } 39 | {...args} 40 | /> 41 | ); 42 | 43 | export const ErrorField = (args: InputProps) => ( 44 | } 48 | errorMessage="This field is required" 49 | {...args} 50 | /> 51 | ); 52 | 53 | export const Label = (args: InputProps) => ( 54 | 55 | ); 56 | -------------------------------------------------------------------------------- /apps/docs/stories/Spinner/Spinner.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import { ComponentMeta } from "@storybook/react"; 4 | 5 | import { Spinner, SpinnerProps } from "@devsozluk/ui/src"; 6 | 7 | export default { 8 | title: "components/Spinner", 9 | component: Spinner, 10 | argTypes: { 11 | variant: { 12 | control: { 13 | type: "select", 14 | options: ["primary", "light"], 15 | }, 16 | }, 17 | size: { 18 | control: { 19 | type: "select", 20 | options: ["sm", "md", "lg"], 21 | }, 22 | }, 23 | }, 24 | } as ComponentMeta; 25 | 26 | const Template = (args: SpinnerProps) => ( 27 | Hello World 28 | ); 29 | 30 | export const Primary = Template.bind({}); 31 | 32 | Primary.args = { 33 | variant: "primary", 34 | }; 35 | -------------------------------------------------------------------------------- /apps/docs/stories/TextArea/TextArea.stories.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | import { ComponentMeta } from "@storybook/react"; 4 | 5 | import { Button, TextArea, TextAreaProps, IconButton } from "@devsozluk/ui"; 6 | import { FaFileUpload, FaImage } from "react-icons/fa"; 7 | 8 | export default { 9 | title: "components/TextArea", 10 | component: TextArea, 11 | argTypes: { 12 | label: { 13 | control: { 14 | type: "text", 15 | }, 16 | }, 17 | placeholder: { 18 | control: { 19 | type: "text", 20 | }, 21 | }, 22 | errorMessage: { 23 | control: { 24 | type: "text", 25 | }, 26 | }, 27 | }, 28 | } as ComponentMeta; 29 | 30 | export const Default = (args: TextAreaProps) => ( 31 | 48 | ); 49 | 50 | export const ErrorField = (args: TextAreaProps) => ( 51 | 40 | 41 | {children} 42 | 43 | {errorMessage && } 44 | 45 | ); 46 | }; 47 | 48 | const TextAreaActions = ({ children }: { children?: React.ReactNode }) => { 49 | return ( 50 |
51 | {children} 52 |
53 | ); 54 | }; 55 | 56 | TextArea.Actions = TextAreaActions; 57 | -------------------------------------------------------------------------------- /packages/ui/src/index.tsx: -------------------------------------------------------------------------------- 1 | import * as React from "react"; 2 | export { Button, type ButtonProps } from "./Button/Button"; 3 | export { IconButton, type IconButtonProps } from "./IconButton/IconButton"; 4 | export { Spinner, type SpinnerProps } from "./Spinner/Spinner"; 5 | export { Input, type InputProps } from "./Input/Input"; 6 | export { Alert, type AlertProps } from "./Alert/Alert"; 7 | export { TextArea, type TextAreaProps } from "./TextArea/TextArea"; 8 | -------------------------------------------------------------------------------- /packages/ui/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@devsozluk/tsconfig/react-library.json", 3 | "include": ["."], 4 | "exclude": ["dist", "build", "node_modules"] 5 | } 6 | -------------------------------------------------------------------------------- /pnpm-workspace.yaml: -------------------------------------------------------------------------------- 1 | packages: 2 | - "apps/*" 3 | - "packages/*" 4 | -------------------------------------------------------------------------------- /prettierrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "semi": true, 4 | "trailingComma": "all", 5 | "printWidth": 80, 6 | "arrowParens": "avoid", 7 | "singleQuote": true 8 | } 9 | -------------------------------------------------------------------------------- /turbo.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://turbo.build/schema.json", 3 | "pipeline": { 4 | "build": { 5 | "outputs": [".next/**", "dist/**", "storybook-static/**"], 6 | "dependsOn": ["^build"], 7 | "env": ["NEXT_PUBLIC_ALTOGIC_ENV_URL", "NEXT_PUBLIC_ALTOGIC_CLIENT_KEY"] 8 | }, 9 | "test": { 10 | "outputs": ["coverage/**"], 11 | "dependsOn": [] 12 | }, 13 | "lint": {}, 14 | "dev": { 15 | "cache": false, 16 | "persistent": true 17 | }, 18 | "clean": { 19 | "cache": false 20 | } 21 | } 22 | } 23 | --------------------------------------------------------------------------------