Build Candy Crush in TypeScript

share link

by kandikits dot icon Updated: Aug 17, 2023

technology logo
technology logo

1-Click Kit 1-Click Kit  


Gulp-typescript is a plugin which allows you to convert your Typescript code into JavaScript. It can serve as an alternative to TypeScript compiler.


This kandi kit for Candy Crush (one of the most popular games), has been rewritten using the Phaser HTML5 game engine along with Typescript language. AngularJs is also used for creating game directives, so they can be easily included in the angular app.


Gulp is a streaming build system which can run tasks in sequence or parallel. Gulp-typescript is a plugin which allows you to convert your Typescript code into JavaScript. It can also serve as an alternative to TypeScript compiler if you don’t want all the features it provides (like support for external modules, rich IDE support). Gulp-concat is used to concatenate files together. Gulp-clean-css is used to remove comments from your CSS code.


The most important part of building a game like Candy Crush is to have a solid workflow. We have used TypeScript, Gulp and Webpack and built a fully-functional Candy Crush game. We'll be using TypeScript, Gulp and Webpack to build a fully-functional Candy Crush game. kandi kit provides you with a fully deployable Candy Crush app. Source code included so that you can customize it for your requirement.

Deployment Information

Candy Crush game created using this kit isadded in this section. The entire solution is available as a package to download from the source code repository.


For Windows OS,

  1. Download, extract and double-click kit installer file to install the kit. Ensure you extract the zip file before running it.
  2. When you're prompted during the installation of the kit, press Y to launch the app automatically.
  3. To run the app manually, press N when you're prompted and locate the zip file candy.zip
  4. Extract the zip file and navigate to the directory candy.
  5. Open the command prompt in the extracted directory candy and run the following commands one by one respectively: npm install; npm install -g gulp; start http://localhost:3000 && gulp start.


For other Operating System,

  1. Install nodejs.
  2. Download the repository.
  3. Extract the zip file and navigate to the directory candy.
  4. Open the terminal in the extracted directory candy.
  5. Run the following commands one by one respectively: npm install; npm install -g gulp; start http://localhost:3000 && gulp start.


Click on the button below to download the solution and follow the deployment instructions to begin set-up. This 1-click kit has all the required dependencies and resources you may need to build your Candy Crush App.

Troubleshooting

  1. While running batch file, if you encounter Windows protection alert, select More info --> Run anyway
  2. During kit installer, if you encounter Windows security alert, click Allow
  3. While executing 'start http://localhost:3000 && gulp start' command, if you encounter browser-sync issue, go to default-config.js file, which will be under node_modules\browser-sync\dist directory and set property open to false without any quotes.
  4. While running batch file, if you encounter npm not recognized error, re-run the batch file.
  5. If you face any issues while running the candy crush app, reduce the node version to 10.24.1

For a detailed tutorial on installing & executing the solution as well as learning resources including training & certification opportunities, please visit the OpenWeaver Community

Development Environment

Visual Studio Code is a source-code editor made by Microsoft for Windows, Linux, and macOS. Features include support for debugging, syntax highlighting, intelligent code completion, snippets, code refactoring, and embedded Git.

vscodeby microsoft

TypeScript doticonstar image 147328 doticonVersion:1.79.2doticon
License: Permissive (MIT)

Visual Studio Code

Support
    Quality
      Security
        License
          Reuse

            vscodeby microsoft

            TypeScript doticon star image 147328 doticonVersion:1.79.2doticon License: Permissive (MIT)

            Visual Studio Code
            Support
              Quality
                Security
                  License
                    Reuse

                      Runtime Environment

                      Node.js is an open-source, cross-platform, JavaScript runtime environment. It executes JavaScript code outside of a browser.

                      nodeby nodejs

                      JavaScript doticonstar image 95980 doticonVersion:v20.3.0doticon
                      License: Others (Non-SPDX)

                      Node.js JavaScript runtime :sparkles::turtle::rocket::sparkles:

                      Support
                        Quality
                          Security
                            License
                              Reuse

                                nodeby nodejs

                                JavaScript doticon star image 95980 doticonVersion:v20.3.0doticon License: Others (Non-SPDX)

                                Node.js JavaScript runtime :sparkles::turtle::rocket::sparkles:
                                Support
                                  Quality
                                    Security
                                      License
                                        Reuse

                                          JavaScript Libraries

                                          The following libraries provide flexibility to automate slow, and redundant workflows efficiently.

                                          gulp-typescriptby ivogabe

                                          JavaScript doticonstar image 794 doticonVersion:v5.0.1doticon
                                          License: Permissive (MIT)

                                          A TypeScript compiler for gulp with incremental compilation support.

                                          Support
                                            Quality
                                              Security
                                                License
                                                  Reuse

                                                    gulp-typescriptby ivogabe

                                                    JavaScript doticon star image 794 doticonVersion:v5.0.1doticon License: Permissive (MIT)

                                                    A TypeScript compiler for gulp with incremental compilation support.
                                                    Support
                                                      Quality
                                                        Security
                                                          License
                                                            Reuse

                                                              gulpby gulpjs

                                                              JavaScript doticonstar image 32767 doticonVersion:v4.0.2doticon
                                                              License: Permissive (MIT)

                                                              A toolkit to automate & enhance your workflow

                                                              Support
                                                                Quality
                                                                  Security
                                                                    License
                                                                      Reuse

                                                                        gulpby gulpjs

                                                                        JavaScript doticon star image 32767 doticonVersion:v4.0.2doticon License: Permissive (MIT)

                                                                        A toolkit to automate & enhance your workflow
                                                                        Support
                                                                          Quality
                                                                            Security
                                                                              License
                                                                                Reuse

                                                                                  gulp-concatby gulp-community

                                                                                  JavaScript doticonstar image 787 doticonVersion:Currentdoticon
                                                                                  License: Permissive (MIT)

                                                                                  Streaming concat middleware for gulp

                                                                                  Support
                                                                                    Quality
                                                                                      Security
                                                                                        License
                                                                                          Reuse

                                                                                            gulp-concatby gulp-community

                                                                                            JavaScript doticon star image 787 doticonVersion:Currentdoticon License: Permissive (MIT)

                                                                                            Streaming concat middleware for gulp
                                                                                            Support
                                                                                              Quality
                                                                                                Security
                                                                                                  License
                                                                                                    Reuse
                                                                                                      JavaScript doticonstar image 634 doticonVersion:4.3.0doticon
                                                                                                      License: Permissive (MIT)

                                                                                                      Minify css with clean-css.

                                                                                                      Support
                                                                                                        Quality
                                                                                                          Security
                                                                                                            License
                                                                                                              Reuse

                                                                                                                gulp-clean-cssby scniro

                                                                                                                JavaScript doticon star image 634 doticonVersion:4.3.0doticon License: Permissive (MIT)

                                                                                                                Minify css with clean-css.
                                                                                                                Support
                                                                                                                  Quality
                                                                                                                    Security
                                                                                                                      License
                                                                                                                        Reuse

                                                                                                                          Kit Solution Source

                                                                                                                          TypeScript doticonstar image 42 doticonVersion:Currentdoticon
                                                                                                                          License: Permissive (MIT)

                                                                                                                          Candy crush like game made with Phaser HTML5 game engine

                                                                                                                          Support
                                                                                                                            Quality
                                                                                                                              Security
                                                                                                                                License
                                                                                                                                  Reuse

                                                                                                                                    phaser-candy-crushby anjmao

                                                                                                                                    TypeScript doticon star image 42 doticonVersion:Currentdoticon License: Permissive (MIT)

                                                                                                                                    Candy crush like game made with Phaser HTML5 game engine
                                                                                                                                    Support
                                                                                                                                      Quality
                                                                                                                                        Security
                                                                                                                                          License
                                                                                                                                            Reuse

                                                                                                                                              Support

                                                                                                                                              If you need help using this kit, you may reach us at the OpenWeaver Community.

                                                                                                                                              See similar Kits and Libraries