When I started coding this project, I was strongly feeling that webpack isn't a suffient tool for building a modern, production-ready frontend applications.
With Darty, I tried to make frontend development easy and more straight-forward with single declarative manifest file. Even though I used webpack under the hood, Darty was an opinionated frontend development environment and so many complicated configurations are hidden from codebase.
Today I cannot maintain this project anymore as a single contributor. It needs to be rewritten to compete with its current alternatives but it's impossible for me at the moment. However abandoning projects are sad, I'm glad to see my idea is somehow proved with the releases of Snowpack and Vite.
Please check out Vite for a community-supported, well-maintained webpack alternative.
Darty is a front-end development system to allow developers to start their projects immediately. By Darty's convention over configuration mindset, webpack and typescript compiler configurations are handled by darty's itself.
Darty React App is a front-end development template for Darty.
- Source: https://github.com/eserozvataf/darty-react-app
- Preview: https://dartyreactapp.herokuapp.com/
- Transforms ES2015+Typescript files with .ts/.tsx extension into browser-compatible JavaScript code.
- Module bundling for packing everything into modules with their sourcemaps.
- Dynamic code splitting.
- SASS/LESS compilation of .scss, .sass and .less files.
- CSS Modules.
- Minification for stylesheets and scripts.
- Hot module reloading and continuous development environment.
- Isomorphic/Universal codebase between server and client.
- Server-side rendering.
- IntelliSense support on TypeScript.
- Unit-testing setup and TDD-ready environment.
- JavaScript and TypeScript linting.
- Autoprefixed CSS to avoid adding vendor prefixes.
- Containerization-ready for continuous integration/deployment environments.
- React with Hooks for rendering UI components, with DevTools support.
- React Router for SPA routing.
- Semantic UI and Font-Awesome are included.
- Jest and React Testing Library for tests.
- Webpack module bundling.
- express for server-side rendering.
Ensure that node.js is installed on your system first.
- Use the GitHub template on https://github.com/eserozvataf/darty-react-app/generate.
- Clone your generated repository afterwards.
- Finally, use the following commands:
yarn install
yarn devUse the following command to create app with create-darty-app:
yarn create darty-app react app
cd app
yarn devClone the git repo and execute install dependencies from npm to get ready:
git clone --branch=master https://github.com/eserozvataf/darty-react-app.git app
cd app
yarn install
yarn devUse yarn <task> command in project folder to execute tasks defined in
package.json.
| Task | Description |
|---|---|
bundle |
Builds the project, generates required files |
bundle:prod |
Builds the project, generates required files (production) |
start |
Starts SSR-enabled express server |
dev |
Enables live development environment powered by hot module reloading |
lint |
Executes linter to check codebase against linting errors |
lint:fix |
Executes linter to check and FIX codebase against linting errors |
test |
Runs tests to check codebase against unit testing scenerios |
test:coverage |
Runs tests with calculating coverage stats |
containerize |
Creates containerization files and gives instructions for docker |
| Path. | Description |
|---|---|
/src/ |
The folder for your source files |
/src/app/ |
Main Application |
/src/app/assets/ |
- Assets (images, fonts, stylesheets, etc.) |
/src/app/layouts/ |
- Layouts / Templates |
/src/app/pages/ |
- Pages |
/src/app/appContainer.tsx |
- Main application router |
/src/startup.ts |
The list and configuration of your mapped applications |
/src/index.html |
The index file |
/public/ |
The folder for your static files will be on your webroot |
See GitHub Projects for more.
- node.js (https://nodejs.org/)
Uses google-webfonts-helper for embedding webfonts.
Apache 2.0, for further details, please see LICENSE file
See contributors.md
It is publicly open for any contribution. Bugfixes, new features and extra modules are welcome.
- To contribute to code: Fork the repo, push your changes to your fork, and submit a pull request.
- To report a bug: If something does not work, please report it using GitHub Issues.