All Projects → DavidVujic → clojurescript-amplified

DavidVujic / clojurescript-amplified

Licence: other
Examples on how to setup a ClojureScript web app with tools from the JavaScript ecosystem.

Programming Languages

clojure
4091 projects
javascript
184084 projects - #8 most used programming language
HTML
75241 projects

Projects that are alternatives of or similar to clojurescript-amplified

aws-reinvent-2019-mobile-workshops
AWS re:Invent 2019 Mobile Workshops
Stars: ✭ 72 (+22.03%)
Mutual labels:  aws-amplify
cuida
A design system built by Sysvale, using storybook and Vue components
Stars: ✭ 16 (-72.88%)
Mutual labels:  storybook
components
Reusable React components used by HospitalRun
Stars: ✭ 109 (+84.75%)
Mutual labels:  storybook
react-imageViewer
React component for image displaying in full screen
Stars: ✭ 61 (+3.39%)
Mutual labels:  storybook
storybook-graphql-kit
Write GraphQL queries and pass response data to your components
Stars: ✭ 19 (-67.8%)
Mutual labels:  storybook
lofi
VHS music machine from the 80's
Stars: ✭ 24 (-59.32%)
Mutual labels:  storybook
chanyeong
👨‍💻 chanyeong's portfolio and blog webpage
Stars: ✭ 39 (-33.9%)
Mutual labels:  storybook
GNUI
💅 Nordcloud's design system for SaaS products.
Stars: ✭ 21 (-64.41%)
Mutual labels:  storybook
vue-authoring-template
Vue project template for authoring component and their use case
Stars: ✭ 14 (-76.27%)
Mutual labels:  storybook
fyndiq-ui
Library of reusable web frontend components for Fyndiq
Stars: ✭ 39 (-33.9%)
Mutual labels:  storybook
storybook-webpack-federation-plugin
Exposes all the components in your Storybook as Webpack 5 federated components.
Stars: ✭ 54 (-8.47%)
Mutual labels:  storybook
storybook-addon-blabbr
Component reviewer for React Storybook
Stars: ✭ 13 (-77.97%)
Mutual labels:  storybook
babel-plugin-storybook-csf-title
A Babel plugin to generate titles for Storybook CSF stories at compile time, typically based on the story file's file name.
Stars: ✭ 17 (-71.19%)
Mutual labels:  storybook
storybook-talk
Storybook, the playground you need for your UI components! 🎨
Stars: ✭ 11 (-81.36%)
Mutual labels:  storybook
public-ol-web-template
OrangeLoops Web Project Boilerplate
Stars: ✭ 28 (-52.54%)
Mutual labels:  storybook
amazon-cognito-example-for-external-idp
An example for using Amazon Cognito together with an external IdP
Stars: ✭ 222 (+276.27%)
Mutual labels:  aws-amplify
lerna-starter
Simple React UI Development environment boilerplate to develop, test and publish your React components.
Stars: ✭ 55 (-6.78%)
Mutual labels:  storybook
public-ol-native-template
OrangeLoops React-Native Project Boilerplate
Stars: ✭ 37 (-37.29%)
Mutual labels:  storybook
Gatsby-Starter-Typescript-Apollo-Storybook
Starter with the bare essentials needed for a typescript, apollo, storybook, emotion Gatsby site
Stars: ✭ 17 (-71.19%)
Mutual labels:  storybook
design-system
A Storybook project for UI development of React components for the MetaBrainz projects
Stars: ✭ 19 (-67.8%)
Mutual labels:  storybook

ClojureScript. Amplified.

In this repo, you will find examples on how to setup a ClojureScript web app with tools from the JavaScript ecosystem.

Up and running

If you want to try out the AWS Amplify specific code, you will need to install a CLI from AWS and run some initialization steps. Everything is described in the official Amplify docs.

There's an alias in shadow-cljs.edn named :app-with-amplify that will start up a AWS Amplify enabled app.

Want to try out Storybook or Material-UI, without having to setup AWS Amplify?

If so, then you can safely skip the Amplify init stuff, and just use the :app alias.

Commands
npm install

and

npm run watch

or

npm run watch-with-amplify

Because of AWS Amplify, I had to split the Clojure compilation from the 3rd party JavaScript build by using both shadow-cljs and Webpack. Explained in the blog post Hey Webpack, Hey ClojureScript

If you have started the watch-with-amplify script, also run this in a separate terminal (otherwise you can skip this step):

npm run pack

If you want to run Storybook and the stories available in this repo, there is a script ready for you:

npm run storybook

Emacs user?

You can add a .dir-locals.el to the root of this repo to wire up the shadow-cljs commands, instead of running the npm commands.

Emacs .dir-locals.el example for starting the app with the Material-UI and Storybook examples:

((nil . ((cider-default-cljs-repl . shadow)
         (cider-shadow-default-options . ":app")
         (cider-shadow-watched-builds . (":app" ":stories")))))

For AWS Amplify example code, replace the :app alias with :app-with-amplify, like this:

((nil . ((cider-default-cljs-repl . shadow)
         (cider-shadow-default-options . ":app-with-amplify")
         (cider-shadow-watched-builds . (":app-with-amplify" ":stories")))))

Articles

Develop a ClojureScript web app, using cool tools from the JavaScript ecosystem.

ClojureScript.Amplified.

About ClojureScript and a setup for AWS Amplify, using Webpack

Hey Webpack, Hey ClojureScript

About ClojureScript and Storybook

Component Driven ClojureScript with Storybook

About Clojurescript and Material-UI

Material Design in a Functional World

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].