Trying to Get Started with Bourbon/SASS (& How to Compile in Adobe Brackets) - css

Apologies for my daftness here, but trying to start a new design workflow and having a hard time wrapping my head around a few basic concepts.
I know that I want to join the party late and begin utilizing preprocessing in my development. After a lot of deliberation, I've also decided that I want to use Bourbon/Neat as the basic framework (as opposed to Bootstrap, etc.). Lastly, I've also decided to move over to Adobe Brackets after years of using Komodo Edit as my basic editor.
That said, I'm struggling to figure out how to get the damn thing to work. I've installed the SASS plugin for Brackets, but how exactly do I get Bourbon installed, get to work and start compiling. I've been reading articles, but feel like there's something about the process that I'm just not comprehending. If anyone can lend some thoughtful advice, it would be MUCH appreciated!

Do not bother with plugin, just follow framework guide (1. install it using ruby/node/whatever 2. run framework file watcher, it will compile sass css on save).
If you want to stick with plugin, then explore author's repo, it contains an example.

Related

How can I localize my Meteor JS App?

I need to get my Meteor JSapp in more than one language.
What would be the best approach for i18n?
Google passed my quite a bit of results but reading them I am more confused than happy. There a many hacks but is there a settled solution to this?
This is more a comment than an answer (however my repu still is too low :o):
Localization normally is only needed client side (there are exceptions but not many and they can be dealt with) and as Meteor is quite young with an own templating engine it's normal that you find more hacks than stable solutions.
However you can doge that bullet by using an older client side templating technique than Meteors built in one like AngularJS with Angular-Meteor (http://angularjs.meteor.com/). Personally I can just recommend this project as it gives you a lot more power than Blaze alone does. And now when you look for solutions for localizing AngularJS you will find a lot more. One I can recommend is angular-gettext (https://angular-gettext.rocketeer.be/) which also comes with a grunt script to extract and compile your strings in one click and which builts a .pot file so that you can translate your app with PoEdit just like you would with an old school webapplication. The only thing you may need to do yourself is to extend the grunt script to parse for any custom translation functions you may add (but maybe you can live without those than you wouldn't need to do anything).

Orchard and CSS Preprocessing

Has anyone attempted to use a CSS Preprocessing when doing Front End Development in Orchard (particularly with Bootstrap)?
I currently use Web Matrix for all my Orchard dev work, but looking to expand beyond the available Bootstrap themes and incorporate LESS. I'm unsure of the best route to go.
Any tips appreciated.
If you must use WebMatrix, then install this extension, which will compile your LESS files from the IDE when you save them. http://extensions.webmatrix.com/packages/OrangeBits
Have you tried instructions that reverand put on this site:
http://orchard.codeplex.com/discussions/291401
Still new to Orchard myself, and this post is pretty old. Basically he says that you need to install a DotLess module that will translate your less file into css.

Simple html templating for small sites with grunt

Looking for a simple html templating solution for small sites.
I really want to do some basic includes (similar to some super simple PHP) that generate out to flat html. I had tried using Assemble.io but it seems to contain so much more.
For reference I'm coming from mixture.io which has some really easy templating but since it is a subscription I cant have that be the way our whole office makes sites. I have also seen middleman but I feel like node is just a lot easier to deal with.
I feel like there is a way to do what I'm looking for with mustache alone but my javascript is not very good. Any help would be greatly appreciated.
I'd recommend looking into Cabin
http://colinwren.github.io/Cabin/
Workflow uses Grunt and they added livereload support in the last release. Good alternative to using Jekyll.

What framework should I use to build a web-based text annotation site?

I know almost nothing about this sort of thing, so please forgive the newbie question.
I want to put together an open-source online literature annotation system. I hear this sort of thing is easier to do with frameworks like Drupal or Django, but I don't know very much about them. I found some Drupal plugins that handle text annotation. Is that the best way to go?
Oh by the way, if anyone is interested in contributing, please contact me, because I could use all the help I could get. I've been putting up ideas at http://hyperlit.tiddlyspace.com/
Annotator by Open Knowledge Foundation might do what you want - used by OpenShakespeare...dual MIT/GPL, code is on Github, has a couchdb backend but you can develop your own storage since it is separate from the javascript annotation tool.
I have an idea to use drupal as a document repository and integrate okfn annotator but very much an idea, not a project (yet) - my particular use case is commenting on legislation/draft legislation.
For Drupal, these potentially might do what you want (in various states of development/functionality):
Open Review
Yellow
marker
discussions on Marginalia but no
movement
Sticky Notes and other older modules did not fit my use case
[ http://drupal.org/project/sticky_notes ]
EDIT: Commentpress for wordpress might get you up and running quickly with limited features.

Techniques for building Drupal Modules Quickly?

I'm looking to see if anyone has any resources or tips for developing basic Drupal modules faster? Have you come up with anything to make your Module development faster?
The Drupal module documentation is kinda hard to understand and pretty massive. I'm wondering if anyone has simplified it and given techniques/tips for getting specific things done quickly. I'm currently looking for Drupal 6 and 7. Any help saving time will be greatly appreciated :-)
In general, I'd recommend picking up a copy of the Productive Programmer. There's nothing earth shattering in it, but there are lots of small tips that can increase your productivity incrementally.
For Drupal specifically, Pro Drupal Development and Pro Drupal 7 Development, though not focused strictly on speed of development, are indispensable.
Beyond that...
in the first place, if you don't have to, Don't Write Code
get familiar with the most commonly used hooks
learn to use Drush and Drush Make
learn to use Devel and Theme Developer modules
use the Schema module to generate your module's schema code, based on an existing table
use the Data module (+ this patch) to generate the code to expose your module's tables to Views
use the Form Builder module to generate form code
use Coder to learn the Drupal coding standards, which will help others help you
set up "quick searches" to allow you to quickly search api.drupal.org
learn the shortcuts in your IDE or text editor (I like Netbeans partially because of the Drupal plugin); print out a good cheatsheet
learn to use version control effectively
Well, there really no fast track to it. If you understand the Drupal API regarding module development (install, menus, blocks, forms, etc) you will grasp it. The hardest part I remember was wrapping my head around the menu system.
One thing that helped was taking simple modules and seeing how they worked, and problem solving my own solutions. Reading Pro Drupal Development helps too.
You basically need to have an understanding where to look (API function, hook, system... ) when you want to do X. There is really no need to memorize all hooks/functions in detail with all the arguments and stuff. That's something you can easily look up. Especially if you're using an IDE with I suggest (Using Netbeans myself).
Especially when you're altering stuff, try to develop some techniques to quickly figure out what code is responsible for the stuff you want to change. One example is to look at the hook_menu() definition of the module that does it and then check out the page callback and skim through the code. Things to look up: Are there hooks you can use, is it a form (if yes, what is the form_id, how is the form structured) and so on.
The best and maybe only way to get there (knowing where too look) is exercise. Every time you do something, you'll be faster the next time when you have to do something similar. I think what also helps is working on core/contrib modules together with others. You not only get to learn these modules better, you also learn how to read and understand code written by others better and you improve your own coding style.
Try to utilize proven, generic "building block" modules like Views, Flags, Panels, CCK/Field and so on. Then, the heavy lifting is done by these modules and you only need to provide the glue code to properly integrate them with your site. Might take a bit more time the first time you use these modules but you will likely save a lot time after that.
That having said, I'm not sure if the goal should be to build modules fast. I'd say the goal is to build modules better. Try to make them generic, secure, flexible, theme-able and so on with the goal to re-use these modules on the next site your building, when you need something similar.
The majority of basic drupal module development is copy and paste. If you use textmate, the Drupal bundle for it allows you to build up key bits of modules (menus, theming functions etc) just by point and click (as it contains most of the necessary code snippets; you just fill in your info).
Following the module building tutorials is good too; the truth is, if you spent 3 or 4 weeks doing it day in day out, and you already have some background in coding, you'll be just fine.
Gedit for Drupal will preconfigure the very good Gedit editor/IDE for you.
For example, a new module: create an empty module file mymodule.example. Enter that file.
module<tab> And it expands into a full, predefined module.
Or in any module: hook<tab> to see a list of available hooks. Choose e.g. menu<tab> and it expands to a full predefined hook_menu. With <tab> you can walk trough all the variable parts in that new hook, to fill in the details.
Drupal.rb Has a.o. a $ drupal generate module "modulename" command that opens an interactive shell, wich allows building scaffolds for modules. The templates from which these scaffolds are built, are overridable.

Resources