abhinavs / cookie

Landing website + Blog using Jekyll & Tailwind CSS

Cookie - a fast and easy to deploy landing website for your next project.

Cookie is a Jekyll and Tailwind CSS based static website that makes the whole process of creating and launching landing websites extremely easy. With its responsive and mobile friendly pages, integrated blog, additional pages and Soopr integration, you can focus on building your product than landing website.

Features

• Well-designed landing page
• Responsive and mobile friendly
• Additional pages like about us, terms of service & privacy policy
• Integrated blog, write content in markdown format
• Easy to customize using Tailwind CSS
• Fast and performant website
• SEO optimized (uses Jekyll SEO Tag)
• RSS feed (uses Jekyll Feed)
• Easy to deploy, one-click deploy on Netlify possible
• Soopr integrated - easy to customize share & like buttons, URL shortning and website analytics
• Auto generated share images for social media using Soopr

Demo

You can see demo app deployed here

Used by

• APIC Blocks
• Soopr
• Annexr
• APIC Agent
• Chhoti Si Kahani

Why Jekyll?

Jekyll is a static website generator - what it means is that in production, your site will be faster because it has been converted into HTML pages while deployment. Another reason is that by separating your landing website from your app website, your app servers get comparatively free and can boost performance for your regular customers.

Cookie uses Tailwind 2.0 which is a good improvement over Tailwind 1.0. Update: Now Cookie uses Tailwind 3.0

Installation

1. Fork this repository.
2. cd cookie
3. bin/bootstrap

Starting Server

bin/start - development server will start at http://127.0.0.1:4061

Customizing

1. You can customize landing page by modifying index.html in root directory.
2. You can customize other website pages by modifying files present in _pages directory. You can add more pages too - you will be able to directly link to them using filename. Don't forget to change Terms & Privacy Policy.
3. You can write blog posts in _posts directory. It's a regular Jekyll blog, and Tailwind Typography for better blog formating and code syntax highlighting is already included.
4. You should also checkout _config.yml in root directory, and add relevant details. Many of them are used for SEO purposes.
5. You should also add favicons in custom-head.html present in _includes directory. You can use RealFaviconGenerator.
6. You can customize image assets in assets/img directory.
7. You will have to hook the 'Work with Us' form present on main page with a real backend.
8. Font Awesome is also integrated, to add any icon in your HTML files, you can refer to the website
9. Sign up for free on Soopr and add your publish_token in _config.yml file - with this, each page gets short URL, like button and auto generated share image for social media.

Deploy Instructions

Website can be easily deployed on all the cloud providers (AWS etc.), and on static website hosting services like Netlify & Vercel. You can also use this button to do one click deploy

Contributing

Bug reports and pull requests are welcome on GitHub at https://github.com/abhinavs/cookie.

Acknowledgement

Cookie uses landing page provided by Tailwind Starter Kit - thanks for providing an amazing landing page under MIT License. Initial code was also inspired by Jekyll TailwindUI

License

This project is available as open source under the terms of the MIT License.

Other Projects

If you like Cookie, do check out my other projects

• moonwalk - a fast and minimal blog theme with clean dark mode
• scoop - a Sinatra boilerplate project using Corneal, ActiveRecord, Capistrano, Puma & Nginx
• soopr - a tool that supports you in content marketing
• apicagent - a FREE API that extracts device details from user-agent string
• pincodr - a FREE API for Indian pincodes
• humangous - create public and private 'working with you' guides
• blockr - a CLI tool to help you easily block and unblock websites
• microrequests - a Python library to help you consume microservice efficiently

✨⚡You can read more about me on my blog or follow me on Twitter - @abhinav

cookie's Issues

build / publish

Cookie works fine for development. In production, only the home loads properly!
I tried creating the bin/publish script for this. All built links to local pages fail with 404 errors.
Build fails to put the .html suffix on the end of href values.

Can I share my .gitlab-ci.yml?

Hi, I copied your repository into my gitlab to practice my CI/CD skills.
Your project has some things that I was needed to think about a little more than just deployed a simple Jekyll Website (the template is already done in gitlab).

I was wondering if other people were interested in this. Can I add it to your project? If you want for sure.

Have a good Week

webrick

This must be the only web server I've ever seen, without a single console/network warning!
Please run

bundle add webrick

I can make a pull request, as you like

Cannot serve on cloud Google Drive folder

Hi! First of all, let me congratulate you on your theme, it looks amazing.

I want to study the theme, so I cloned it on my Google Drive shared folder, where I have also done some limited testing of other themes and jekyll in general.

I am using:

• mac OS 13.1
• and

/opt/homebrew/opt/ruby/bin/ruby
ruby 3.2.0 (2022-12-25 revision a528908271) [arm64-darwin22]
/usr/local/bin/jekyll
jekyll 4.3.1

The commands given in the readme replicate the error (anonymised user-specific fields):

./bin/bootstrap
./bin/start

and the error is the following

(base) ➜  cookie git:(master) ✗ ./bin/start                                 
Configuration file: /Users/***/Library/CloudStorage/GoogleDrive-*****@gmail.com/Other computers/My Laptop/***/***/cookie/_config.yml
            Source: /Users/***/Library/CloudStorage/GoogleDrive-*****@gmail.com/Other computers/My Laptop/***/***/cookie
       Destination: /Users/***/Library/CloudStorage/GoogleDrive-*****@gmail.com/Other computers/My Laptop/***/***/cookie/_site
 Incremental build: disabled. Enable with --incremental
      Generating... 
       Jekyll Feed: Generating feed for posts
bundler: failed to load command: jekyll (/opt/homebrew/lib/ruby/gems/3.2.0/bin/jekyll)
/opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-postcss-v2-1.0.1/lib/jekyll-postcss-v2/hook.rb:32:in ``': No such file or directory - /Users/***/Library/CloudStorage/GoogleDrive-*****@gmail.com/Other (Errno::ENOENT)
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-postcss-v2-1.0.1/lib/jekyll-postcss-v2/hook.rb:32:in `process'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-postcss-v2-1.0.1/lib/jekyll-postcss-v2/hook.rb:42:in `block in <top (required)>'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/hooks.rb:103:in `block in trigger'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/hooks.rb:102:in `each'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/hooks.rb:102:in `trigger'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-minifier-0.1.10/lib/jekyll-minifier.rb:184:in `write'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:231:in `block in write'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:368:in `block (2 levels) in each_site_file'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:365:in `each'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:365:in `block in each_site_file'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:364:in `each'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:364:in `each_site_file'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:230:in `write'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/site.rb:82:in `process'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/command.rb:28:in `process_site'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/commands/build.rb:65:in `build'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/commands/build.rb:36:in `process'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/command.rb:91:in `block in process_with_graceful_fail'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/command.rb:91:in `each'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/command.rb:91:in `process_with_graceful_fail'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/lib/jekyll/commands/serve.rb:86:in `block (2 levels) in init_with_program'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/mercenary-0.4.0/lib/mercenary/command.rb:221:in `block in execute'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/mercenary-0.4.0/lib/mercenary/command.rb:221:in `each'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/mercenary-0.4.0/lib/mercenary/command.rb:221:in `execute'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/mercenary-0.4.0/lib/mercenary/program.rb:44:in `go'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/mercenary-0.4.0/lib/mercenary.rb:21:in `program'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/jekyll-4.3.1/exe/jekyll:15:in `<top (required)>'
        from /opt/homebrew/lib/ruby/gems/3.2.0/bin/jekyll:25:in `load'
        from /opt/homebrew/lib/ruby/gems/3.2.0/bin/jekyll:25:in `<top (required)>'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/cli/exec.rb:58:in `load'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/cli/exec.rb:58:in `kernel_load'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/cli/exec.rb:23:in `run'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/cli.rb:491:in `exec'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/vendor/thor/lib/thor/command.rb:27:in `run'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/vendor/thor/lib/thor/invocation.rb:127:in `invoke_command'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/vendor/thor/lib/thor.rb:392:in `dispatch'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/cli.rb:34:in `dispatch'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/vendor/thor/lib/thor/base.rb:485:in `start'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/cli.rb:28:in `start'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/exe/bundle:45:in `block in <top (required)>'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/lib/bundler/friendly_errors.rb:117:in `with_friendly_errors'
        from /opt/homebrew/lib/ruby/gems/3.2.0/gems/bundler-2.4.3/exe/bundle:33:in `<top (required)>'
        from /opt/homebrew/opt/ruby/bin/bundle:25:in `load'
        from /opt/homebrew/opt/ruby/bin/bundle:25:in `<main>'

Let me know if there's anything else I can give to replicate the issue. Finally, no Google Drive is not full :P

Edit: I should mention that I tried the same in a local folder and it works without this error, and the site loads.

Error: Cannot find module 'postcss'

Hi there, thanks for your contribution of this beautiful theme.

After I ran bin/bootstrap success , and then bin/start,
Then I met a problem log like this:

192:cookie-master xxx$ bin/start
Configuration file: /Users/xxx/cookie-master/_config.yml
module.js:491
    throw err;
    ^
Error: Cannot find module 'postcss'
    at Function.Module._resolveFilename (module.js:489:15)
    at Function.resolve (internal/module.js:18:19)
    at Object.<anonymous> (/Library/Ruby/Gems/2.6.0/gems/jekyll-postcss-0.4.0/bin/postcss:3:33)
    at Module._compile (module.js:573:30)
    at Object.Module._extensions..js (module.js:584:10)
    at Module.load (module.js:507:32)
    at tryModuleLoad (module.js:470:12)
    at Function.Module._load (module.js:462:3)
    at Function.Module.runMain (module.js:609:10)
    at startup (bootstrap_node.js:158:16)

Did I miss something or did something wrong?
If so, please give me some advice.

You can get some detail in my published Github Page